troubleshooting Question

Jquery function not working in IE

Avatar of maccaj51
maccaj51Flag for Afghanistan asked on
jQueryJavaScript
4 Comments1 Solution327 ViewsLast Modified:
Hi Experts,

This function works when called in all browsers except IE... is there anything obvious that I'm doing wrong?

(function ($) {

    $.fn.wavesurf = function (options) {
        var defaults = {
            increment: false,
            gridSize: 320,
            surfSize: 400,
            normalSize: 960,
            maxSize: 1600,
            surfCustom: $.noop // I want a user supplied method here
        };
		

        var surfOptions = $.extend(defaults, options);

        var increment = surfOptions.increment;
        var gridSize = surfOptions.gridSize;
        var surfSize = surfOptions.surfSize;
        var normalSize = surfOptions.normalSize;
        var maxSize = surfOptions.maxSize;


        var containerOuterWidth = $(this).outerWidth();
        var containerInnerWidth = $(this).innerWidth();
        var windowWidth = $(window).innerWidth();

        var gridCount = Math.floor(windowWidth / gridSize);
        var gridCountWidth = gridCount * gridSize;


        if (increment === false) {
            if (windowWidth >= maxSize) {
                $(this).css("width", maxSize);
                $(this).removeClass("surf");
            } else if (windowWidth > normalSize && windowWidth < maxSize) {
                $(this).css("width", normalSize);
                $(this).removeClass("surf");
            } else if (windowWidth > surfSize && windowWidth < normalSize) {
                $(this).css("width", normalSize);
                $(this).removeClass("surf");
            } else if (windowWidth < surfSize) {
                $(this).css("width", gridSize);
                $(this).addClass("surf");
            }

        } else {

            if (gridCountWidth === gridSize) {
                $(this).css("width", gridSize);
                $(this).addClass("surf");
            } else if (windowWidth < maxSize && windowWidth > gridSize) {
                $(this).css("width", gridCountWidth);
                $(this).removeClass("surf");
            } else if (windowWidth >= maxSize) {
                $(this).css("width", maxSize);
                $(this).removeClass("surf");
            }


        }

        if ($.isFunction(options.surfCustom)) {
            // call user provided method
            options.surfCustom.call();
        }
    };
})(jQuery);

Open in new window


and then call it like this...

$(window).bind("load resize", function () {
        $('#container').wavesurf({
            increment: false,
            gridSize: 320,
            surfSize: 400,
            normalSize: 960,
            maxSize: 1280,
            surfCustom: function () {

// Execute more script in here //

}
        });
    });

Open in new window


Many thanks in advance
ASKER CERTIFIED SOLUTION
maccaj51

Our community of experts have been thoroughly vetted for their expertise and industry experience.

Join our community to see this answer!
Unlock 1 Answer and 4 Comments.
Start Free Trial
Learn from the best

Network and collaborate with thousands of CTOs, CISOs, and IT Pros rooting for you and your success.

Andrew Hancock - VMware vExpert
See if this solution works for you by signing up for a 7 day free trial.
Unlock 1 Answer and 4 Comments.
Try for 7 days

”The time we save is the biggest benefit of E-E to our team. What could take multiple guys 2 hours or more each to find is accessed in around 15 minutes on Experts Exchange.

-Mike Kapnisakis, Warner Bros