Question

I’ve come so far (but you wouldn’t know it). Struggling through my art website.

This page
http://rollinleonard.com/elements/
This page has a little overlay div that hovers over these img. The first img is in the background of a div. I want that img to also have this blue highlighter effect.

How do I get it so that its a normal img and then on another layer over that img there is my nav (text with white background)?

Thanks!

Answer 1

add this in your js file inside the $(window).load() event

$('#navwrap').bind('mouseenter', function () {
    var $this = $(this);
    if ($this.not('.over')) {
        $this.addClass('over');
        $overlay.css({
            width  : $this.css('width'),
            height : $this.css('height'), 
            top    : $this.offset().top + 'px',
            left   : $this.offset().left + 'px'
        }).show();
    }
 }).bind('mouseout', function () {
     $(this).removeClass('over');
 });