WordPress.org

Ready to get started?Download WordPress

Forums

problem with jQuery image tooltip scripts (5 posts)

  1. jjcorradi
    Member
    Posted 2 years ago #

    Hi,
    I'm trying to implement an image tooltip effect onto a menu.
    I'm trying with this:
    http://demos.blufusion.net/jquery-tooltips

    I really don't understand why on a stand-alone demo file on my pc everything goes well and when I try to move the same code into my WP website nothing works.

    It seems that the script is not executed because - when I hover the link a want to tooltip - in Firebug I only see:
    <span class="tooltip-style2">
    instead of:
    <span class="tooltip-style2" style="display: none; top: 13px; left: 160px;">

    I checked again and again and I think everything is all right:

    1) I embedded in to the head the jquery script (the same version of the demo) and I excluded other versions to avoid conflicts.
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>

    2) I embedded into the head the tooltip script:
    <script type="text/javascript">
    $(document).ready(function() {
    $(".tooltips").hover(
    function() { $(this).contents("span:last-child").css({ display: "block" }); },
    function() { $(this).contents("span:last-child").css({ display: "none" }); }
    );
    $(".tooltips").mousemove(function(e) {
    var mousex = e.pageX + 10;
    var mousey = e.pageY + 5;
    $(this).contents("span:last-child").css({ top: mousey, left: mousex });
    });
    });
    </script>

    3) I included into the .css file the code required.

    I'm working on a thematic child theme I'm building, so I did all the embedding through functions into functions.php and everything seems ok looking at the resulting code.

    Can anyone help me? I'm going crazy.
    I tryed with other scripts but many of them aren't suitable with my needs and with another one which could be ok (http://cssglobe.com/post/1695/easiest-tooltip-and-image-preview-using-jquery) I'm facing the same problem.

    Thanks,
    andrea

  2. esmi
    Theme Diva & Forum Moderator
    Posted 2 years ago #

  3. jjcorradi
    Member
    Posted 2 years ago #

    thks, I'll check carefully.
    anyway my situation is pretty simple: the script is embedded in the head section, that's all.
    I worked this way many other times without problems.
    I'm afraid there's somethjing to change in the script code, but I'm not so skilled.

  4. jjcorradi
    Member
    Posted 2 years ago #

    Got it!
    The loading of jquery Superfish plugin, automatically included in thematic, for some reason conflicts with my tooltip scripts.
    Excluding it with the
    childtheme_override_head_scripts()
    function it works!

    Happyness :)))

  5. jjcorradi
    Member
    Posted 2 years ago #

    correction, now I understood completely.
    the problem is not the superfish javascript, the keypoint is:

    In "no-confict" mode, the $ shortcut is not available and the longer jQuery is used.

    Since the jquery automatically loaded by WP is in "no-confict" mode I must swap the "$" with "jQuery" in my script.

    This way works perfectly with the last autoloaded versione of jquery even with the superfish enabled.

Topic Closed

This topic has been closed to new replies.

About this Topic