0

试图让淡入淡出/隐藏在 chrome 中工作，当在 chrome 中运行此代码时，它会冻结浏览器，但它在 IE10 和 Firefox 中工作，基本上是一个简单的 div 从屏幕上滚动并淡出，任何帮助将不胜感激。此外，动画结束后 div 会恢复到原来的位置，这就是为什么我要淡出（也看起来更干净）的原因。

jQuery.noConflict();
jQuery('.dildobox').click(function () {

var v = document.getElementsByTagName("audio")[0];
v.play();

jQuery("div.dildobox").html('<img src="images/dildo/standstillhop.gif" alt="" />');
jQuery(this).animate({
    left: '-700px',
}, 3000);

jQuery("div#dildodialog").fadeIn(1500).dialog({
    buttons: {
        "Yeah, Baby!": function () {
            jQuery("div#dildodialog").dialog("close");
        }
    }
}).prev().find(".ui-dialog-titlebar-close").hide();

jQuery("div.dildobox").fadeOut(500);


});

CSS如下：

#dildocache{height:1px;width:1px;display:inline-block;}
#dildocontainer {height: 10px;margin: 0;padding: 0;position: relative;width: 10px;}
.dildo{display:inline-block;height: 50px;width: 50px;position:absolute;}
.dildobox {
font-size: 50px;
height: 71px;
position: relative;
text-align: center;
width: 34px;
}
#dildodialog{font-weight: bold;text-align:center;background: url("../images/dildobg.png") repeat scroll 50% top #f8f8f8;color:#000;}
.ui-dialog-buttonset .ui-button-text-only, .ui-widget-header{background: none repeat-x scroll 50% 50% #ad0401!important; color:#fff;}
.ui-dialog-buttonpane{background: none repeat scroll 50% 50% #ad0401!important;}

/* Dildo Page Specific Placements */
.moduletablewelcomedildo #dildocontainer{left: 275px;top: -30px;}

和 HTML：

<div id="dildocache">
<img src="images/dildo/standstillhop.gif" alt="standstillhop" width="1" height="1" style="visibility:hidden;"/></div>
<div id="dildodialog" title="Where's Dildo?" style="display:none;">
<p>Congratulations! You've found one but there's more to find!<br/>Keep poking around!</p>
</div>
<div id="dildocontainer">
<div id="dildobox2" class="dildobox"><img src="images/dildo/smalldildo.png" alt="" /></div>
</div>
<audio src="http://www.accentuateit.com.au/addon_domains/allowe/images/dildo/yeahbaby.ogg"></audio>
4

1 回答 1

0

好的，我设法通过删除有问题的 HIDE 和 FADEOUT 变化并简单地使用 opacity: 0 作为动画的选项来修复它，这也让我在动画运动的过程中淡出这很好:) 如果你想看结果：jsfiddle.net/Eb3Q8/7 不知道为什么它在我的网站上而不是在 JSFiddle 上崩溃，但是无论如何都修复了 :)

于 2013-04-02T03:21:15.887 回答