问题描述
我做的demo在附件里 问题是 每次加载页面效果都是好的,可是一改变浏览器的大小,效果就飞了,麻烦帮忙调一下 问题补充:baozhifei 写道
解决方案
回答的时候居然不能上传附件,郁闷。我做了一下,不知道合不合你意。直接把代码保存成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" /><title>Untitled Document</title><script type="text/javascript" src="jquery-1.6.4.min.js"></script><style>#contact {width: 189px;position: fixed;top: 200px;right: -157px;}#contact h3 {width: 32px;height: 139px;margin: 0;padding: 0;float: left;background: url('img3-5_1.png') left top no-repeat;text-indent: -9999em;}#contact div {width: 157px;padding: 39px 0 0 0;float: right;background: url('img3-5_2.png') right top no-repeat;}#contact div ul {width: 100%;margin: 0;padding: 0 0 46px 0;background: url('img3-5_4.png') right bottom no-repeat;}#contact div ul li {width: 100%;height: 24px;list-style: none;text-align: center;background: url('img3-5_3.png') left top repeat-y;}#contact div ul li a {color: #000;font: bold 12px/24px "宋体";text-decoration: none;}</style><script type="text/javascript">$(function() {var isShow = false;var isMoving = false;$('#contact').hover(function(e) {var self = $(this);if (!isMoving) {if (!isShow && parseInt(self.css('right')) < 0) {isMoving = true;self.animate({right: '+=157'}, 1000, function() {isShow = true;isMoving = false;});}}}, function(e) {var self = $(this);if (!isMoving) {if (isShow && parseInt(self.css('right')) == 0) {isMoving = true;self.animate({right: '-=157'}, 1000, function() {isShow = false;isMoving = false;});}}});});</script></head><body><div id="contact"><h3>联系方式</h3><div><ul><li><a href="#">联系烈火技术</a></li><li><a href="#">联系烈火技术</a></li><li><a href="#">联系烈火技术</a></li><li><a href="#">联系烈火技术</a></li><li><a href="#">联系烈火技术</a></li></ul></div></div></body></html>