jQuery悬停在图库图像效果上

Question

I'm new to jquery. I found a lightbox gallery on a website that I want to emulate. I know how to use the standard light box code here http://leandrovieira.com/projects/jquery/lightbox/

But I want my thumbnails to have a hover effect where a new color border appears with text over the image like on the site below.

Shown here http://wozcreative.com/

This is a wordpress site with a plugin.

How do I do the same with jquery?

Answer 1

It looks like your answer is in the code of the page in question

<!-- Portfolio Effect Script -->
    <script type="text/javascript">
        jQuery(function(){
            jQuery('#portfolio li', this ).mouseenter(function() {
                jQuery('.description', this).slideDown('fast');
         });
         jQuery('#portfolio li', this ).mouseleave(function() {
                 jQuery('.description', this).slideUp('fast');
             });
         });
    </script>

I'm not sure why he's calling JQuery explicitly (I think it's because he's also using yui) but you could replace the JQuery with $

Anyway, it looks like he has list elements with images and hidden descriptions, when you mouse over it unhides the description.

Answer 2

This is exactly what you are looking for.

WP Visual Slidebox Builder