关闭

滚果鼠标到指定位置触发事件。代码不会么写。。。求代码!!

32人阅读 评论(0) 收藏 举报
滚果鼠标到指定位置,想实现的效果:scrollTop()>350  触发 openwin() 事件;scrollTop()<350  触发closewin()  事件。代码不会么写。。。求代码!!求实例。。。


<style type="text/css">

#contact {
margin:0 auto;z-index:9997;width:100%;;height:140px; padding:0px 0px; position:fixed;bottom:0px; background: none; 
/* IE6 */
     _position:absolute;
     _top: expression(documentElement.scrollTop + documentElement.clientHeight-this.offsetHeight); 
 _bottom:auto;
     overflow:visible;
}

#lefttips {
z-index:9999;width:50px;;height:117px; padding:0px 0px; position:fixed;bottom:0px; background:#EC7515; text-align:left; margin-bottom:210px;
/* IE6 */
     _position:absolute;
     _top: expression(documentElement.scrollTop + documentElement.clientHeight-this.offsetHeight); 
 _bottom:auto;
     overflow:visible;
}



 .bg{ width:100%; height:200px; background:#000; -moz-opacity:0.6; -webkit-opacity:0.6; opacity:0.6; filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=60); }
 .con{ width:100%; height:200px; color:#fff; position:relative; margin-top:-200px; }

.demo5 {
  font: 16px/1 'Roboto', sans-serif;
  text-align: center;
  color: #555;
  background: #ddd;
}


.demo {
  padding: 0px 0;
  border-bottom: 1px solid #aaaaaa;
  background: #eee;
}

.demo:nth-child(odd) {
  background: none;
}

.demo:last-child {
  border: 0;
}



input[type='text1'] {
  width: 120px;
  padding: 10px 10px 12px 70px;
  font-size: 15px;
  color: #555;
  border: 1px solid #aaaaaa;
  background-color: #fff;
}

input[type='text2'] {
  width: 120px;
  padding: 10px 10px 12px 82px;
  font-size: 15px;
  color: #555;
  border: 1px solid #aaaaaa;
  background-color: #fff;
}

.css {
  display: inline-block;
  position: relative;
  margin: 2px 2px 2px 2px;
}

.css input {
  transition: .1s all linear;
}

.css label {
  position: absolute;
  top: 13px;
  left: 10px;
  font-size: 12px;
  color: #000;
  transition: .1s all linear;
  cursor: text;
}


.demo5 .css.active label {
  top: 8px;
  left: 10px;
  padding: 5px;
  color: #fff;
  background: #EC7515;
}


</style>

 
  
<div  style="width:100%;margin:0 auto;">
   <div id="contact" style="display:none ">
<form action="activityinfo_submit.html" method="post" name="form1" style="padding:0; margin:0">
      <input type="hidden" name="pro" value="获取报价">
<div class="bg"></div>
  <div class="con"> 
<table  width="100%"  border="0" cellspacing="0" cellpadding="0" >
  <tr>
        <td colspan="3" align="right" height="17" style="color:#ffffff"><span style="cursor:pointer;" onclick="closewin()"><font size="3px">关闭&nbsp;&nbsp;</span></td>
  </tr>
  <tr>
    <td></td>
    <td><table width="1050" align="center" b border="0" cellspacing="0" cellpadding="0">
      <tr>
        <td width="310" rowspan="2"><img src="images/b1.png" width="300" height="48" /></td>
        <td width="212"><div class="demo demo5">
        <div class="css">
            <label>您的姓名</label>
    <input type="text1"  name="Tname" id="linkman"/>
</div></td>
        <td width="212"><div class="demo demo5">
        <div class="css">
    <label>您的手机号</label>
    <input type="text2" name="tel" id="mobile"/>
  </div></td>
     
<td rowspan="2" width="110" align="center"><input type="image" src="images/bm12.jpg" width="85" align="middle"/></td></a>
        <td width="221" rowspan="2"><div align="center" style="color:#ffffff"><font size="5px"><strong>免费报价电话</strong></font> </div><br><p align="center" style="color:#EC7515">
<font size="5px"><strong>0510-85525598</strong></font></td>
      </tr>
      <tr>
        <td width="212"><div class="demo demo5">
        <div class="css">
    <label>楼盘名称</label>
    <input type="text1" name="loupan" id="mobile"/>
  </div></td>
        <td width="212"><div class="demo demo5">
        <div class="css">
    <label>建筑面积</label>
    <input type="text2" name="addr" id="linkman"/>
  </div></td>
        
  <script src="js/baojia.js"></script>
        </tr>
    </table></td>
    <td></td>
  </tr>
  </table></div>
   </form>
  </div>



<div id="lefttips" style="display:block">
<span style="cursor:pointer;" onclick="openwin()"><img src="images/bmm.jpg"></span></td>  
</div>

<div id="pageTop"></div>


<script type="text/javascript">
function openwinds(title,url){
    layer.open({
        type: 2,
        title: title,

        maxmin: true,
        shadeClose: true, //点击遮罩关闭层
        area : ['430px' , '400px'],
        content: [url, 'no']
    });
};


function closewin() {
document.getElementById("contact").style.display = 'none';
document.getElementById("lefttips").style.display = '';
}

function openwin() {
document.getElementById("contact").style.display = '';
document.getElementById("lefttips").style.display = 'none';
}


 

</script>




0
0

查看评论
* 以上用户言论只代表其个人观点,不代表CSDN网站的观点或立场
    个人资料
    • 访问:961次
    • 积分:181
    • 等级:
    • 排名:千里之外
    • 原创:18篇
    • 转载:0篇
    • 译文:0篇
    • 评论:0条
    文章存档