Home/ Questions/Q 1091159
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-16T23:28:53+00:00

Seem to be having some issues with executing jQuery code in the caption class.

  • 0

Seem to be having some issues with executing jQuery code in the “caption” class.

My class “.showmore” lies within the caption section, however when I perform a hover function, it does not seem to execute this jQuery function.

Is there anything within the Galleriffic jQuery that is preventing me from executing this???

<html>
    <head>
        <link rel="stylesheet" href="<?php echo $siteurl; ?>css/galleriffic-2.css" type="text/css" />
        <script type="text/javascript" src="<?php echo $siteurl; ?>js/jquery.galleriffic.js"></script>
        <script type="text/javascript" src="<?php echo $siteurl; ?>js/jquery.opacityrollover.js"></script>
    </head>

    <script type="text/javascript">
        $('.showmore').hover(function(){
            $(this).fadeTo('fast', 1);
        });
    </script>

    <div class="caption">    
        <div class="showmore">+</div>
    </div>
Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    Try moving your <script> to the bottom of the page. Currently $('.showmore').hover(...) is executed before the .showmore div is written to the page.

    Alternatively you can try something like this:

    $(function() {
    $('.showmore').hover(function(){
        $(this).fadeTo('fast', 1);
    });
});

    This ensures that you’re code is executed after the DOM is finished loading. See .ready() for more information.

    Also try passing two functions into the hover event. It really shouldn’t matter (see source code), but typically, hover takes in two functions as parameter — the first is executed when the mouse enters the element and the second is executed when the mouse leaves the element. Here’s an example:

    $('.showmore').hover(function() { $(this).fadeIn('fast'); },
                     function() { $(this).findOut('fast'); });

    When only one function is passed in, that function is executed both when the mouse enters and leaves the element.

    Also, make sure that you’re including jquery to the page. In the example you posted, it seems you’re including the galleriffic and opacityrollover plugins but not jquery core.

    • 0