[javascript] Uncaught TypeError: Object #<Object> has no method 'movingBoxes'

Im trying to use the movingBoxes plugin with my asp.net mvc site and it is not working (obviously). I have the movingboxes.js imported in my head tag in the site.master like so

    <script src="<%: Url.Content("~/Scripts/jquery.movingboxes.js")%>" type="text/javascript"></script>

and the browser successfully gets this script. Now i have a regular view that inherits from the site.master that has this little bit of jquery in it that calls the movingBoxes plugin

<script type="text/javascript">
    $(document).ready(function () {
        $($('#slider-one'));
        $('#slider-one').movingBoxes({
            startPanel: 1,      
            panelWidth: .5,     
            fixedHeight: false
        });

        $('#slider-two').movingBoxes({
            startPanel: 1,     
            panelWidth: .5,     
            fixedHeight: false
        });
    });
</script>

When i view the page. Every thing works fine (including other jquery stuff) except for this plugin and i get this error

And here is the description of the error

Any help would be appreciated

EDIT

So apparently I had this:

    <script type="text/javascript" src="../../Scripts/jquery-1.4.1.js" />
    <script src="<%: Url.Content("~/Scripts/jquery.movingboxes.js")%>" type="text/javascript"></script>

And it works now by changing it to this:

    <script type="text/javascript" src="../../Scripts/jquery-1.4.1.js"></script>
    <script src="<%: Url.Content("~/Scripts/jquery.movingboxes.js")%>" type="text/javascript"></script>

It's also a good idea to make sure you're using the correct version of jQuery. I had recently acquired a project using jQuery 1.6.2 that wasn't working with the hoverIntent plugin. Upgrading it to the most recent version fixed that for me.

i had the same problem i had linked jquery twice . The later version was overwriting my plugin.

I just removed the later jquery it started working.

I found that I was using a selector for my rendorTo div that I was using to render my column highcharts graph. Apparently it adds the selector for you so you just need to pass id.

renderTo: $('#myGraphDiv') to a string 'myGraphDiv' this fixed the error hope this helps someone else out as well.

When I had this problem it was because I was trying to use an actual function in place of an anonymous function.

Incorrect:

$(document).on('change', "#MyId", MyFunction());

Correct

$(document).on('change', "#MyId", MyFunction);

or also correct and if you need to pass event object or other params.

$(document).on('change', "#MyId", function(e) { MyFunction(e); });

I had the same problem. I changed the order of the scripts in the head part, and it worked for me. Every script the plugin needs - needs to stay close.

For example:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script>
<script type="text/javascript" src="http://cloud.github.com/downloads/malsup/cycle/jquery.cycle.all.latest.js"></script>
<script type="text/javascript"> 
$(document).ready(function() {
    $('#slider').cycle({
            fx: 'fade' 
        });
    });
</script>

Actually i think that you have downloaded just a part of the script. Try to check 'Core' checkbox before download the whole script in jquery site.

I had a such problem too because i was using IMG tag and UL tag.

Try to apply the 'corners' plugin to elements such as $('#mydiv').corner(), $('#myspan').corner(), $('#myp').corner() but NOT for $('#img').corner()! This rule is related with adding child DIVs into specified element for emulation round-corner effect. As we know IMG element couldn't have any child elements.

I've solved this by wrapping a needed element within the div and changing IMG to DIV with background: CSS property.

Good luck!

I just had this same problem with the jquery Responsive Slides plugin (http://responsive-slides.viljamis.com/).

I fixed it by not using the jQuery short version $(".rslides").responsiveSlides(.. but rather the long version: jQuery(".rslides").responsiveSlides(...

So switching $ to jQuery so as not to cause conflict or using the proper jQuery no conflict mode (http://api.jquery.com/jQuery.noConflict/)

Please keep in mind that only a few elements can be self-closing, most others have to be closed through adding an explicit end tag. In the above case, the first script tag was not closed properly, the end script tag of the second script then closed the script section, causing only the first script to be loaded as external script source and ignoring the second script.

More info about which tags can be self-closed, have a look at the W3C drafts for HTML5 (although the definition was no different in earlier HTML-versions):

http://www.w3.org/TR/html5/syntax.html#end-tags (8.1.2.1, Point 6)