1

这是使2个div一起淡入的正确方法吗？（contact_close 应该在contact_box 的前面，作为contact_box 的关闭按钮。

编辑：修复了一些 divnames。

Javascript

$(document).ready(function(){ 

 $(".button_contact").click(function() { 
    $("#contact_box").fadeIn("slow");
 $(".contact_close").fadeIn("slow");
});

 $(".contact_close").click(function() { 
      $(this).fadeOut("slow"); 
      $("#contact_box").fadeOut("slow"); 
    });

});

CSS

body{
    margin: 0;
    padding: 0;
    text-align: center;
    background-color:#f0f2df;
}

#container{
    border: solid 1px #f0f2df;
    background-color:#f0f2df;
    text-align: left;
    margin: auto;
    width: 939px;
    height: 570px;
    top:41px;
    position:relative;
}
#contact_box{
    display: none;
    background-image:url(../images/bg.png);
    width: 703px;
    height: 379px;
    position:absolute;
    left:236px;
    bottom:34px;

}
.contact_close{
    display:none;
    background-image:url(../images/close.png);
    width:17px;
    height:17px;
    position:absolute;
    right:5px;
    top:135px;
}

HTML

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<link rel="stylesheet" type="text/css" href="css/main.css" />
<title>test</title>
<script type='text/javascript' src='js/jquery.js'></script>
<script type='text/javascript' src='js/click.js'></script>
</head>

<body>
    <div id="container">
        <div class="button_contact"></div>
        <div id="contact_box">
        <div class="contact_close"></div></div>
</div>
</body>
</html>
4

3 回答 3

2

是的，没关系。

有很多方法可以做很多事情，但是像这样简单的事情并不需要非常技术性的方法。

于 2009-12-18T20:54:10.900 回答
0

我没有彻底分析您的代码，但将关闭框放在 div 内而不是在它旁边似乎更合乎逻辑。

于 2009-12-18T22:08:32.737 回答
0

你可以在同一个语句中淡化它们

$('#contact_box, .contact_close').fadeIn('slow')

这更有效，因为 jQuery 只启动一个淡入淡出操作。

于 2009-12-18T22:12:13.913 回答