Skip to main content

This site requires you to update your browser. Your browsing experience maybe affected by not having the most up to date version.

General Questions /

General questions about getting started with SilverStripe that don't fit in any of the categories above.

Moderators: martimiz, Sean, biapar, Willr, Ingo, swaiba, simon_w

jquery.corner.js "function is not avaiable"


Reply


5 Posts   1612 Views

Avatar
Xazen

Community Member, 18 Posts

31 October 2011 at 3:35am

Hello,

I am trying find a possibility to display rounded corners for IE8 and found this plugin:
http://jquery.malsup.com/corner/

I used a simple test to check wether the plugin works anyway. Using a simple *.html it works.

But unfortunatly it won't work in SilverStripe. In the templates/Page.ss I added 2 lines after $MetaTags:
<script type="text/javascript" src="/mysite/javascript/jquery-1.6.4.min.js"></script>
<script type="text/javascript" src="/mysite/javascript/jquery.corner.js"></script>

To make sure the div exist when I use the corner() function I added some more lines:
<script type="text/javascript">
   $(document).ready(function(){
      $('#Banner').corner();   
   });
</script>

The Banner-div is defined in /templates/Layout/Home.ss I try to move the div to Page.ss but it won't work either. Firebug shows this error:
$("#Banner").corner is not a function

Avatar
SheaDawson

Community Member, 46 Posts

31 October 2011 at 2:16pm

What other javascripts are running on the page? I'd get rid of any other javascript and see if that fixes it... then add each one back in one by one to see what is breaking it.

Avatar
Xazen

Community Member, 18 Posts

3 November 2011 at 10:43am

First of all thanks for the answer. Unfortunatly it won't work. I have got NoScript Add-On for Firefox installed. The Add-On only recognize 3 Sites:
2 belongs to facebook and 1 to my domain. Even after removing the Facebook Timeline it won't work. Does anyone manage it ? If yes, at least I know it is possible within SilverStripe.

Avatar
Tim Snadden

Community Member, 32 Posts

6 November 2011 at 9:17am

There are a couple of things that could be going on here. I've found that if you add a file via Requirements::javascript('/broken/path/to/my.js') it is silently discarded. So firstly make sure that your path is correct and that the file is loading. Secondly you may be getting conflict between Prototype and jQuery as they both use '$' as a shortcut. There are a couple of standard ways of handling this.

1. Use scope to ensure that $ means what you want. This is a pretty common way of wrapping jquery scripts. You pass the jQuery object into your self executing function as follows.

;(function($) {
$(document).ready(function(){
$('#Banner').corner();
});
})(jQuery);

2. Explicitly use jQuery object rather than $ shortcut. e.g.

jQuery(document).ready(function(){
jQuery('#Banner').corner();
});

Avatar
Xazen

Community Member, 18 Posts

6 November 2011 at 10:22am

I am pretty sure the path is correct. I try to give a wrong path on porpuse. In that case Firebug tells me:
"NetworkError: 404 Not Found - http://www.mysite.de/mysite/jdavascript/jquery.corner.js"

I tried what you tell me as well.

The 2nd one won't work. It tells me the same as before.

The 1st one seems to work. At least Firebug isn't telling me anything. But after I have a look in IE8 through a VM nothing happends.
To make sure the function is called I add a alert to the function, which works fine.

Have you tried the plugin ?