-8

I'm busy creating a banner that rotates but for some reason I'm getting this error in my firebug console. I don't see where I'm going wrong but maybe someone here in stackoverflow can see my mistake.

ReferenceError: $ is not defined

$(window).load(function(){

This is my jquery

    function rotateBanners(eqval){

    eqval = Number(eqval);
    var bannercount = $(".portfolio-single").length;
    var active_banner = $(".portfolio-active");

    if(active_banner.css("left") != "0px") return false;

    if(eqval > bannercount-1){
        eqval = 0;
    }

    var activeEQ = active_banner.index();
    active_banner.addClass("portfolio-inactive");
    active_banner.removeClass("portfolio-active");

    $(".portfolio-single").eq(eqval).addClass("portfolio-active");
    $(".portfolio-single").eq(eqval).removeClass("portfolio-inactive");
    $(".triggers a").removeClass("active");
    $(".triggers a").eq(eqval).addClass("active");

    if(eqval < activeEQ && directionVAR == "right"){

        $(".portfolio-single").eq(activeEQ).delay(0).stop(true,true).animate({"left":100+"%"}, 1200, "easeOutCubic",function(){
            $(this).css("left",-100+"%");
        });
        $(".portfolio-single").eq(eqval).css("left",-100+"%");
        $(".portfolio-single").eq(eqval).delay(0).stop(true,true).animate({"left":0+"%"}, 1200, "easeOutCubic",function(){
            var eqvalPlus = eqval+1;
            timeout = setTimeout('rotateBanners('+eqvalPlus+')',5000);
        });
    }else{
        $(".portfolio-single").eq(activeEQ).delay(0).stop(true,true).animate({"left":-100+"%"}, 1200, "easeOutCubic",function(){
            $(this).css("left",100+"%");
        });
        $(".portfolio-single").eq(eqval).css("left",100+"%");
        $(".portfolio-single").eq(eqval).delay(0).stop(true,true).animate({"left":0+"%"}, 1200, "easeOutCubic",function(){
            var eqvalPlus = eqval+1;
            timeout = setTimeout('rotateBanners('+eqvalPlus+')',5000);
        });
    }
    directionVAR == "left"
}


$(window).load(function(){

    if($(".portfolio-single").length > 0){

        var src = $('.portfolio-single').eq(0).find("img").attr("src");

        if (src) {
            var img = new Image();
            img.style.display = "none";
            img.onload = function() {
                $('.portfolio-single').eq(0).stop(true,true).fadeIn(800,function(){
                    if($(".portfolio-single").length > 1){
                        //rotateBanners(1);
                        timeout = setTimeout('rotateBanners(1)',5000);
                    }
                });

            };
            img.src = src;
        }   
    }


});
user3656554
  • 91
  • 1
  • 2
  • 9
  • jQuery isn't being included before you use `$`. Please [search for existing solutions](https://www.google.ca/search?q=ReferenceError%3A+%24+is+not+defined&oq=ReferenceError%3A+%24+is+not+defined&aqs=chrome..69i57j69i58.148j0j7&sourceid=chrome&es_sm=91&ie=UTF-8) before asking new questions. – meager May 23 '14 at 14:46
  • Have you included the jQuery library? – Brandon May 23 '14 at 14:46

2 Answers2

0

You are using jQuery before referencing it. Simply make sure that the jQuery reference is in the <head> section, possibly before other js files.

Stefano Altieri
  • 4,387
  • 1
  • 20
  • 38
0

You should put the references to the Jquery script first.

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>

In other words, you are trying to use Jquery, before you get it included.

gsamaras
  • 66,800
  • 33
  • 152
  • 256