社区
JavaScript
帖子详情
请问谁可以给我提供像QQ那样的效果的代码
IamFoolBird
2003-07-08 05:55:11
就是点我的好友出现那一层,点击陌生人就出现另一层。
...全文
55
3
打赏
收藏
请问谁可以给我提供像QQ那样的效果的代码
就是点我的好友出现那一层,点击陌生人就出现另一层。
复制链接
扫一扫
分享
转发到动态
举报
写回复
配置赞助广告
用AI写文章
3 条
回复
切换为时间正序
请发表友善的回复…
发表回复
打赏红包
zhaoweiwei
2003-07-08
打赏
举报
回复
<style type="text/css">
.titleStyle{
background-color:#6699CC;color:#ffffff;
border-top:1px solid #FFFFFF;font-size:9pt;cursor:hand;
}
.contentStyle{
background-color:#efefef;color:blue;font-size:9pt;
}
</style>
然后在<BODY>模块中加入以下Javascript代码:
<script language="JavaScript">
var layerTop=50; //菜单顶边距
var layerLeft=50; //菜单左边距
var layerWidth=140; //菜单总宽度
var titleHeight=20; //标题栏高度
var contentHeight=200; //内容区高度
var stepNo=10; //移动步数,数值越大移动越慢
var itemNo=0;
//建立一个名为"itemsLayer"的层,用它限制所有菜单的显示范围:
document.write('<span id=itemsLayer style="position:absolute;overflow:hidden;border:1px solid #008800;left:'+layerLeft+';top:'+layerTop+';width:'+layerWidth+';">');
function addItem(itemTitle,itemContent){
//这个函数准备接受菜单标题和内容的写入
//新增菜单的顶点刚好在上一菜单的标题栏以下,尺寸由一开始便声明的变量决定
itemHTML='<div id=item'+itemNo+' itemIndex='+itemNo+' style="position:relative;left:0;top:'+(-contentHeight*itemNo)+';width:'+layerWidth+';">'+'<table width=100% cellspacing="0" cellpadding="0">'+'<tr><td height='+titleHeight+' onclick=changeItem('+itemNo+') class="titleStyle" align=center>'+itemTitle+'</td></tr>'+'<tr><td height='+contentHeight+' class="contentStyle">'+itemContent+'</td></tr> </table></div>';
document.write(itemHTML);
itemNo++;
}
//这时便可以把菜单标题和内容作为参数调用以上函数了:
//你可以添加任意多项,格式参照以下几行:
addItem('欢迎','<BR><center>欢迎光临1000script!</center>');
addItem('技术文章','<center><a href="#">项目</a> <BR><BR><a href="#">项目</a><BR><BR><a href="#">项目</a><BR><BR><a href="#">更多..</a></center>');
addItem('script库','<center><a href="#">项目</a> <BR><BR><a href="#">项目</a><BR><BR><a href="#">项目</a> <BR><BR><a href="#">更多..</a></center>');
addItem('actionscript库','<center><a href="#">项目</a> <BR><BR><a href="#">项目</a><BR><BR><a href="#">项目</a> <BR><BR><a href="#">更多..</a></center>');
addItem('论坛','<center><a href="#">项目</a> <BR><BR><a href="#">项目</a><BR><BR><a href="#">项目</a> <BR><BR><a href="#">更多..</a></center>');
addItem('精品赏析','<center><a href="#">设计精品</a></center>');
document.write('</span>'); //结束"itemsLayer"层
//下面一式计算"itemsLayer"层的高度:
document.all.itemsLayer.style.height =
itemNo*titleHeight+contentHeight;
//现在开始编写点击标题时移动相应的层:
//初始化变量"toItemIndex"和"onItemIndex",
//它们分别用于记录"应该显示的层"和"现在显示的层":
var toItemIndex=itemNo-1;
var onItemIndex=itemNo-1;
var runtimes=0; //"runtimes"用于记录层移动次数
//菜单标题被点击时调用这个函数:
function changeItem(clickItemIndex){
//判断相应的层应上移还是下移:
toItemIndex=clickItemIndex;
if(toItemIndex-onItemIndex>0) moveUp(); else moveDown();
//一定的时间间隔后继续移动,直到移了设定的步数stepNo:
runtimes++;
if(runtimes>=stepNo){
onItemIndex=toItemIndex;
runtimes=0;}
else
setTimeout("changeItem(toItemIndex)",10);
}
//相应菜单上移:
function moveUp(){
//判断应一起上移的菜单,并让它(们)每次移动contentHeight/stepNo的距离:
for(i=onItemIndex+1;i<=toItemIndex;i++)
eval('document.all.item'+i+'.style.top=parseInt(document.all.item'+i+'.style.top)-contentHeight/stepNo;');
}
//相应菜单下移:
function moveDown(){
for(i=onItemIndex;i>toItemIndex;i--)
eval('document.all.item'+i+'.style.top=parseInt(document.all.item'+i+'.style.top)+contentHeight/stepNo;');
}
changeItem(0); //把第一个菜单作为默认显示
//-->
</script>
coffee_cn
2003-07-08
打赏
举报
回复
sorry
sh.ce.net.cn/web8/tools/sms.rar
coffee_cn
2003-07-08
打赏
举报
回复
sh.ce.net.cn/web8/tools/sms.zip
『教程分享』卡
QQ
空间小尾巴,全部
QQ
空间小尾巴
代码
分享
该博客分享卡
QQ
空间小尾巴的教程及全部
代码
。只需将
代码
复制发到
QQ
空间,即可看到
效果
。文中
提供
了大量以[em]eXXXX[/em]guguaiwu.cn格式的
代码
。
android
qq
卡屏
代码
,2015最新卡死安卓
QQ
代码
卡到让对方手机
QQ
无响应及
代码
分享...
博客分享了最新卡死安卓
QQ
的
代码
,该
代码
经测试仅适用于安卓手机,对苹果手机无效。文中展示了诱导
效果
图和点击后
QQ
无响应的截图,还给出了可直接复制的
代码
,
代码
前文字可随意修改,最后
提供
了一键发送卡死安卓
QQ
代码
的下载。
手机
QQ
空间装逼
代码
收集
本文
提供
了一系列
QQ
空间使用的特殊
代码
,可用于发表说说时添加各种图标和
效果
,如手表、相机、飞机等,并展示了如何自定义这些
代码
实现个性化展示。
qq
2008空间
代码
大全
本文
提供
了丰富的
QQ
空间装饰
代码
,包括动画
效果
、开场
代码
、皮肤、导航和挂件等,适用于个性化装扮
QQ
空间。
在线客服
QQ
代码
本文介绍两种
QQ
在线状态特效
代码
实现方法:一是利用腾讯官方
提供
的互动状态
代码
展示
QQ
在线状态,并实现无需加好友即可聊天的功能;二是实现网页滚动条上下移动
效果
的浮动
QQ
在线客服
代码
。
JavaScript
87,988
社区成员
224,683
社区内容
发帖
与我相关
我的任务
JavaScript
Web 开发 JavaScript
复制链接
扫一扫
分享
社区描述
Web 开发 JavaScript
社区管理员
加入社区
获取链接或二维码
近7日
近30日
至今
加载中
查看更多榜单
社区公告
暂无公告
试试用AI创作助手写篇文章吧
+ 用AI写文章