小编Eva*_*van的帖子

好吧,我以为我正确地实现了这个,但我想我一定是在某个地方搞砸了.

这是我的代码:

Jquery在这里:

jQuery(document).ready(function( $ ){

$(function() {
    $( ".cta-nav-hover" ).tooltip({
        show: null,
        position: {
            my: "right+40 bottom",
            at: "left bottom"
        },
        open: function( event, ui ) {
            ui.tooltip.animate({ top: ui.tooltip.position().top - 10 }, 75 );
        }
    });
});





$(function() {
    $(".fancybox").fancybox();
});

});

那么HTML:

<div id="cta-nav-wrapper">
    <ul id="cta-nav">
        <li class="bio">
            <a href="http://placehold.it/350x125" title="Bio" class="cta-nav-hover fancybox"><span></span></a>
        </li>
    </ul>
</div>

我认为这样可行,但是当我点击链接时,它只是将我带到占位符图像而不是弹出窗口.我做错了什么？看起来我的文件排列正确,或者至少当我通过firebug检查它们时,它会转到正确的js.

这就是我在头脑中所说的:

<!-- Add fancyBox -->
<link rel="stylesheet" href="/wp-content/themes/hustle-child/includes/js/fancyapps-fancyBox-v2.1.5-0-ge2248f4/fancyapps-fancyBox-18d1712/source/jquery.fancybox.css" type="text/css" media="screen" />
<script type="text/javascript" src="/content/wp-content/themes/hustle-child/includes/js/fancyapps-fancyBox-v2.1.5-0-ge2248f4/fancyapps-fancyBox-18d1712/source/jquery.fancybox.pack.js"></script>
<!-- Optionally add helpers - button, …

我的jquery知识上有点(更像是一个非常生锈的).出于某种原因,当绿色的盒子悬停在上面时,我无法弄清楚我在这里错过了什么让蓝色盒子褪色.

剧本:

 $(document).ready(function() {
    $(".hover-text").hover({
    $(".hover-hide").animate({
        opacity: 0.4,
    }, 500);
    });?

html:

 <div class="hover-hide">
    <div class="hover-text">
        BLAH
    </div>
    </div>

css:

 .hover-hide{
    width:200px;
    height:200px;
    background-color:blue;
    padding:30px;
    }
    .hover-text{
    color:white;
    background-color:green;
    padding:10px;
    width:auto;
    margin-top:20px;
    }??

非常感谢!:)