100分,100分,请看看这个网站效果是怎么作的。在线,立即给分。
http://www.gotalk.cn
两个帐号 zorou tian23
游客0210 tian23
我只想实现,那个面板到上边,下边,左边,右边,就自动上去,你再指向时就出来的效果。
[解决办法]
就是一个DIV 的隐藏和显示
当点击 “我的好友” 时 先判断DIV的显示状态,如果是显示的,就隐藏,反之则显示
[解决办法]
将 这段代码拷到你的机子上看效果
<!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 >
<title> Untitled Page </title>
<script language= "JavaScript ">
function show()
{
if(document.getElementById( "Friend ").style.display == "none ")
{
document.getElementById( "Friend ").style.display = "block ";
}
else
{
document.getElementById( "Friend ").style.display = "none ";
}
}
</script>
</head>
<body>
<form id= "form1 " runat= "server ">
<span id= "myF " onclick = "show(); "> 我的好友 </span>
<div id= "Friend " style = "display:none ">
<table>
<tr>
<td> aaaa </td> <td> 在线 </td>
</tr>
<tr>
<td> bbbb </td> <td> 在线 </td>
</tr>
<tr>
<td> cccc </td> <td> 在线 </td>
</tr>
<tr>
<td> dddd </td> <td> 在线 </td>
</tr>
<tr>
<td> eeee </td> <td> 在线 </td>
</tr>
</table>
</div>
</form>
</body>
</html>
[解决办法]
没有甚么好说的,就是纯 js + dhtml 实现的,
当然为了精确控制,你得需要熟悉 html 的样式属性,以及各个浏览器不同属性版本
你可以看其源码, 假如你不会,那就让我【无耻】一回吧 :P
下载、阅读下面的 .js 文件
<html xmlns= "http://www.w3.org/1999/xhtml ">
<head>
<title> GoTalk </title>
<link rel= "stylesheet " type= "text/css " href= "css/talkwindow.css " />
<link rel= "stylesheet " type= "text/css " href= "css/WindowClass.css " />
<link rel= "stylesheet " type= "text/css " href= "css/Editor.css " />
<script src= "js/guid.js "> </script>
<script src= "js/swfobject.js "> </script>
<script src= "js/array_func.js "> </script>
<script src= "js/mousemenu.js "> </script>
<script src= "js/flashchat.js "> </script>
<script src= "js/PopupWindow.js "> </script>
<script src= "js/sarissa.js "> </script>
<script src= "js/divselect.js "> </script>
<script src= "js/editor_quotable.js "> </script>
<script src= "js/sms.js "> </script>
<script src= "js/im.js "> </script>
// ....
[解决办法]
稍微看了下, js 也写得不错, 不过好像有许多第三方的 ....
学习 ...
[解决办法]
怎么什么效果都firefox中都没效啦。
这种效果全是JS做出来的,你查看它的源代码就可以了。