<!--右侧效果--> <script> $().ready(function() { $(".orm").hover(function() { $(this).css("right", "-2px"); }, function() { $(this).css("right", "-175px"); }); }); </script> <div class="orm" style="position:absolute; z-index:1000; top:160px; right:-175px; background:url(‘./images/fxico.png‘);"> <span style="margin-left:80px;">与500家知名电商合作/span> </div> <div class="orm" style="position:absolute; z-index:1000; top:240px; right:-175px; background:url(‘./images/czico.png‘);"> <span style="margin-left:80px;">网上充值用皓诚放心</span> </div> <div class="orm" style="position:absolute; z-index:1000; top:320px; right:-175px; background:url(‘./images/lxico.png‘);"> <span style="margin-left:80px;">提供更专业的预定服务</span> </div> <div class="orm" style="position:absolute; z-index:1000; top:400px; right:-175px; background:url(‘./images/tgico.png‘);"> <span style="margin-left:80px;">餐饮娱乐,休闲酒店各种生活</span> </div>
JS效果 页面固定 <style> *{margin:0} body{height:1000px;width:1000px;} #a{width:300px;height:100px;background:red;} </style> <script> var isie6 = window.XMLHttpRequest?false:true; window.onload = function(){ var a = document.getElementById(‘a‘); var d = document.getElementById(‘d‘); if(isie6){ a.style.position = ‘absolute‘; window.onscroll = function(){ d.innerHTML = ‘‘; } }else{ a.style.position = ‘fixed‘; } a.style.right = ‘0‘; a.style.bottom = ‘0‘; } </script> <div id=‘a‘>测试</div>
JS CSS 网页 简单 右侧 悬浮
时间: 2024-10-10 08:18:47