Question

I’ve got trouble with IE and my jQuery.

I’m using a slider plugin on this WordPress installation, and I’m loading the following code to create 2 custom prev/next buttons:

jQuery(document).ready(function($) {

    var sliderInstance = $("#touchcarousel-1, #touchcarousel-2, #touchcarousel-3, #touchcarousel-4, #touchcarousel-5, #touchcarousel-6").data("touchCarousel");

    $("body").append('<a href="#" class="arrowleft"><img src="/wp-content/themes/revisor/images/left.png" /></a><a href="#" class="arrowright"><img src="/wp-content/themes/revisor/images/right.png" /></a>');

    var arrleft = $(".arrowleft")

        arrright = $(".arrowright");

    var wrapoffset = $("#wrap").offset();

    console.log(wrapoffset.left);

    arrleft.css("left" , wrapoffset.left-100);

    arrright.css("right" , wrapoffset.left-100);

    arrleft.click(function(e)

    {
        e.preventDefault();
        sliderInstance.prev();

    });

    arrright.click(function(e)

    {
        e.preventDefault();
        sliderInstance.next();

    });

    $(window).resize(function() {

        var wrapoffset = $("#wrap").offset();

        arrleft.css("left" , wrapoffset.left-100);

        arrright.css("right" , wrapoffset.left-100);

    });

});

In FF and Chrome, this works fine, but not in IE (tested in IE9).

I’m stumped, as none of the commands on the buttons work – neither CSS, nor the event.

See the page here: http://revisor-faellesskabet.dk/skat/

Answer 1

remove the console.log— It will break in IE since console is only available when developer tools is open