This code results in an error at second line ($('boxes div.box'))

<script type="text/javascript">

    $(document).ready(function () {
        boxes = $('#boxes div.box');
        images = $('#images > div');
        boxes.each(function (idx) {
            $(this).data('image', images.eq(idx));
        }).hover(
            function () {
                boxes.removeClass('active');
                images.removeClass('active');
                $(this).addClass('active');
                $(this).data('image').addClass('active');
            });
    });

</script>

The error is "Object doesn't support this property or method". The same page works fine in Firefox and Chrome.

Anyone?

This code results in an error at second line ($('boxes div.box'))

<script type="text/javascript">

    $(document).ready(function () {
        boxes = $('#boxes div.box');
        images = $('#images > div');
        boxes.each(function (idx) {
            $(this).data('image', images.eq(idx));
        }).hover(
            function () {
                boxes.removeClass('active');
                images.removeClass('active');
                $(this).addClass('active');
                $(this).data('image').addClass('active');
            });
    });

</script>

The error is "Object doesn't support this property or method". The same page works fine in Firefox and Chrome.

Anyone?

• javascript
• jquery
• jquery-selectors

• What do your <script> tags look like, where you're including jQuery? – Nick Craver Commented Oct 4, 2010 at 18:14
• 1 That's an assumption in many cases...if you knew the source of the problem why would you be asking? Script includes cause this, as slight differences will affect only IE, never assume! – Nick Craver Commented Oct 4, 2010 at 18:21

1 Answer 1

You need to declare variables with the var keyword, otherwise IE has no idea where they're ing from and so will just break:

var boxes = $('#boxes div.box');
var images = $('#images > div');