My image gallery (slider) stopped working
I am using the Florance theme and it comes with a sliding image gallery using jquery and jcarousellite. Somehow it stopped working (it was ok 2 days) and error (object does not support this property or method) points to the script. The site in 开发者_开发百科question is www.happystay.net
Please, i need some help. Thanks in advance.
I noticed you're using jQuery.noConflict() right before you declare the Carousel. Is there anything in particular on the page that you're trying to avoid conflict with?
I used Safari's javascript console to run the carousel without the jQuery.noConflict() part, and it seemed to kick into gear. Try editting the script to run using the plain old jQuery $ sign and see what happens.
Edit: Here is what the code might look like if you were to remove the noConflict.
<script type="text/javascript">
$(document).ready(function(){
$(".mygallery").jCarouselLite({
btnNext: ".nextb",
btnPrev: ".prevb",
visible: 1,
easing: "backout",
auto: 800,
speed: 1500
});
});
</script>
Generally speaking there is no reason to use noConflict unless another script is competing for the $ variable. A common example is if you are trying to use jQuery and MooTools on the same website.
please do this....
after line that has this <script type='text/javascript' src='http://www.happystay.net/wp-includes/js/jquery/jquery.js?ver=1.3.2'></script>
put
<script type="text/javascript"> var $jx = jQuery.noConflict(); </script>
it should now look like this... on line 17
<script type='text/javascript' src='http://www.happystay.net/wp-includes/js/jquery/jquery.js?ver=1.3.2'></script>
<script type="text/javascript"> $jx = jQuery.noConflict(); // note i added this line</script>
<script type='text/javascript' src='http://www.happystay.net/wp-content/themes/Florance/js/jquery.easing.1.1.js?ver=2.9.2'></script>
<script type='text/javascript' src='http://www.happystay.net/wp-content/themes/Florance/js/jcarousel.js?ver=2.9.2'></script>
<script type='text/javascript' src='http://www.happystay.net/wp-content/themes/Florance/js/jquery.mousewheel.js?ver=2.9.2'></script>
<script type='text/javascript' src='http://www.happystay.net/wp-content/themes/Florance/js/cufon.js?ver=2.9.2'></script>
<script type='text/javascript' src='http://www.happystay.net/wp-content/themes/Florance/js/Liberation_Serif_400.font.js?ver=2.9.2'></script>
then line 246 should now be this...
<script type="text/javascript">
$jx(document).ready(function(){
$jx(".mygallery").jCarouselLite({
btnNext: ".nextb",
btnPrev: ".prevb",
visible: 1,
easing: "backout",
auto: 800,
speed: 1500
});
});
</script>
Hope it fixes it....
demo here
explanation here
edit:
ok, so it's a wordpress... hmmmm how about in the php script add
echo "<script type='text/javascript'> var $jx = jQuery.noConflict();</script>";
after
wp_enqueue_script('jquery');
精彩评论