Console states method not available but it seems like it should be
I've got a rails app and I'm trying to add a thumbnail scroller. It prints
the div, but the js is not working. Here's the file:
<div id="tS2" class="jThumbnailScroller">
<div class="jTscrollerContainer">
<div class="jTscroller">
<% @illustrations.each do |illustration| %>
<% if illustration.aws_image_thumbnail_url %>
<%= link_to
image_tag(illustration.aws_image_thumbnail_url, :title =>
illustration.name), illustration %>
<% else %>
<%= link_to image_tag(illustration.image.url(:thumb),
:title => illustration.name), illustration %>
<% end %>
<% end %>
</div>
</div>
</div>
<script>
jQuery.noConflict();
(function($){
window.onload=function(){
$("#tS2").thumbnailScroller({
scrollerType:"hoverPrecise",
scrollerOrientation:"horizontal",
scrollSpeed:2,
scrollEasing:"easeOutCirc",
scrollEasingAmount:600,
acceleration:4,
scrollSpeed:800,
noScrollCenterSpace:10,
autoScrolling:0,
autoScrollingSpeed:2000,
autoScrollingEasing:"easeInOutQuad",
autoScrollingDelay:500
});
}
})(jQuery);
</script>
Here's the error in the console:
Uncaught TypeError: Object [object Object] has no method
'thumbnailScroller' 138:168
window.onload 138:168
window.onload
Here's the thumbnailScroller method within jquery.thumbnailScroller.js:
(function($){
$.fn.thumbnailScroller=function(options){
var defaults={ //default options
scrollerType:"hoverPrecise", //values: "hoverPrecise",
"hoverAccelerate", "clickButtons"
scrollerOrientation:"horizontal", //values: "horizontal", "vertical"
scrollEasing:"easeOutCirc", //easing type
scrollEasingAmount:800, //value: milliseconds
acceleration:2, //value: integer
scrollSpeed:600, //value: milliseconds
noScrollCenterSpace:0, //value: pixels
autoScrolling:0, //value: integer
autoScrollingSpeed:8000, //value: milliseconds
autoScrollingEasing:"easeInOutQuad", //easing type
autoScrollingDelay:2500 //value: milliseconds
};
And here you can see that that js file is being loaded in to the rails app
(output from chrome developmnet tools 'resources' tab:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
...
<link href="/assets/jquery.thumbnailscroller.css?body=1" media="all"
rel="stylesheet" type="text/css" />
...
<script src="/assets/jquery.thumbnailScroller.js?body=1"
type="text/javascript"></script>
...
</head>
Does anyone see why this method is not available?
No comments:
Post a Comment