Posted By

touffies on 11/12/10

Tagged

jquery

Versions (?)

Last Edited at 11/12/10 12:06am

Statistics

Viewed 430 times

Favorited by 0 user(s)

Related snippets

Function Rollover

/ Published in: jQuery

This function will find elements with your default classOver and will change the file name to add _ro into it.
ie: filename.gif -> filename_ro.gif

Highlighted TextExpand

/*  ------------------------------------------------------------------
    Rollover --------------------------------------------------------- */
    function imgExist(img) { return $.ajax({ url: img, async: false }).status; }

$.fn.rollover = function (settings) { // param checkIfExist used to check if the image exist, default value "false"
        var container = this;

// defaults settings
        settings = jQuery.extend({
            classOver: ".ro",
            over: "_o",
            checkIfExist: false
        }, settings);

return container.each( function() { 
            var Elm = this;  
            var overElm = $(settings.classOver, Elm);

overElm.each(function(){
                var srcOut = $(this).attr('src');
                var ftype = srcOut.substring(srcOut.lastIndexOf('.'),srcOut.length);
                var fname = srcOut.substring(0, srcOut.lastIndexOf('.'));
                var srcOver = fname + settings.over + ftype;
                var exist = true;
                if (settings.checkIfExist === true) { exist = (imgExist(srcOver) != 404); }
                if(exist)  {
                    $(this).hover(
                        function() { $(this).attr('src', srcOver ); },
                        function() { $(this).attr('src', srcOut ); }
                    );
                }
            });
        });
    };

Report this snippet Tweet

Comments

Subscribe to comments

Comment:

You need to login to post a comment.