当前位置: 首页 > 图文教程 > 网络编程 > Javascript > 從博客網扣了一個效果出來

Javascript
jQuery生成asp.net服务器控件的代码
javascript 实现的完全兼容鼠标滚轴缩放图片的代码
JavaScript学习笔记(十七)js 优化
使用SyntaxHighlighter实现HTML高亮显示代码的方法
javascript contains和compareDocumentPosition 方法来确定是否HTML节点间的关系
利用jQuery 实现GridView异步排序、分页的代码
jquery.lazyload 实现图片延迟加载jquery插件
Lazy Load 延迟加载图片的 jQuery 插件
jquery 插件实现图片延迟加载效果代码
javascript小数计算出现近似值的解决办法
jquery1.4后 jqDrag 拖动 不可用
jquery 应用代码 方便的排序功能
选择TreeView控件的树状数据节点的JS方法(jquery)
jquery 图片Silhouette Fadeins渐显效果
JQuery Dialog(JS 模态窗口,可拖拽的DIV)
javascript 同时在IE和FireFox获取KeyCode的代码
js 键盘记录实现(兼容FireFox和IE)
javascript 函数速查表
jQuery AnythingSlider滑动效果插件
经典海量jQuery插件 大家可以收藏一下

Javascript 中的 從博客網扣了一個效果出來


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-09-12   浏览: 115 ::
收藏到网摘: n/a

從博客網扣了一個效果出來,但有個地方搞不定,求助無憂強人幫忙研究一下。
現在演示:http://www.iyumen.cn/TopUser.asp
效果說明:鼠標放到頭像上,頭像自動變換成另一張圖片。因為我網站里有兩種格式圖片 gif和jpg的,所以,現在如果原圖是jpg的話,就沒問題,如果是gif的話有提示說沒有上傳頭像,其實是有的,只是js里沒有設置讀取到 gif.
所以,我想要的功能就是 鼠標放到圖片上,不需要變換另一張圖片,這個能辦到嗎?
該頁面涉及到的源碼,我弄成壓縮包了,方便高人下載修改。可能我描述的不是很清楚。
复制代码 代码如下:

function oo(obj){
return typeof(obj)=="string"?document.getElementById(obj):obj
}
var eet,eel,bid,dh;
var state=0;
var showi=0;
function asdf_list(sign,id,user){
var xid=id.substr(0,id.length-5)
bid=id;
e=oo(bid)
// alert(name)
var et=e.offsetTop;
var el=e.offsetLeft;
while(e=e.offsetParent){
et+=e.offsetTop;
el+=e.offsetLeft;
}
eet=et;
eel=el;
if(sign==1){
if(showi==0){
if(el<780){
//alert("<780")
oo("navigation_logo").style.right="";
oo("navigation_logo").style.left=(el+119) + "px";
oo("navigation_logo").style.top=(et-3) + "px";
var imgtanchuhtml2="<table width=100% border=0 cellspacing=0 cellpadding=0><tr><td valign=bottom id=tdimg style=padding-top:3px;padding-left:3px; >"
imgtanchuhtml2 +="<dl class=member-detail><dt><a class=user-icon href=#x><div style=float:left;padding-right:1px; id=showlogoimg ></div></a><div id=arrow_img onmouseover=showarrow('1'); onmouseout=showarrow('2'); onClick=disnav(); style=float:left;></div></dt></dl></td></tr></table>"
oo("imgtanchu").innerHTML=imgtanchuhtml2;
oo("ll").src="http://www.iyumen.cn/images/imgs/avatar_border.gif"
oo("lr").src="http://www.iyumen.cn/images/imgs/avatar_border2.gif"
oo("showlogoimg").innerHTML="<img onError=this.src='http://www.iyumen.cn/images/img/logo_s.png' width=100 height=100 src=/UploadFile/" + xid + "/userphoto.jpg alt=" + user + " onClick=disnav();>" + user ;
oo("link_1").innerHTML="<a href=/My_" + xid + ".html target=_blank>去" + user + "的个人主页</a>";
if(loginstate==0){
oo("link_3").innerHTML="<a href=/Sbox.asp?User_ID=" + xid + " target=_blank>给" + user + "发短消息</a>";
}else{
oo("link_3").innerHTML="<a href=javascript:show_login2();>给" + user + "发短消息</a>";
}
oo("link_4").innerHTML="<a href=/List_" + xid + ".html target=_blank>查看" + user + "的评论列表</a>";
oo("oDiv").style.top=(et-3) + "px";
oo("oDiv").style.left=(el-3) + "px";
oo("oDiv").style.display='';
}else{
// alert(">780")
hw = oo("home").scrollWidth - el;
oo("navigation_logo").style.left="";
oo("navigation_logo").style.right=(parseInt(hw)+parseInt(10)) + "px";
oo("navigation_logo").style.top=(et-3) + "px";
oo("navigation_logo").style.left;
var imgtanchuhtml="<table width=100% border=0 cellspacing=0 cellpadding=0><tr><td valign=bottom id=tdimg style=padding-top:3px; ><dl class=member-detail>"
imgtanchuhtml +="<dt><div id=arrow_img onclick=disnav2(); style=float:left;></div><a class=user-icon href=#x><div style=float:left;padding-right:2px; id=showlogoimg ></div></a></dt></dl></td></tr></table>"
oo("imgtanchu").innerHTML=imgtanchuhtml;
oo("arrow_img").style.background="url(http://www.iyumen.cn/images/imgs/avatar_left.gif) top repeat-x; #ff0000;"
oo("ll").src="http://www.iyumen.cn/images/imgs/avatar_border2.gif"
oo("lr").src="http://www.iyumen.cn/images/imgs/avatar_border.gif"
oo("showlogoimg").innerHTML="<img onError=this.src='http://www.iyumen.cn/images/img/logo_s.png' width=100 height=100 src=/UploadFile/" + xid + "/userphoto.gif alt=" + user + " onClick=disnav2();>" + user ;
oo("link_1").innerHTML="<a href=/My_" + xid + ".html target=_blank>去" + user + "的主页</a>";
if(loginstate==0){
oo("link_3").innerHTML="<a href=/Sbox.asp?User_ID==" + xid + " target=_blank>给" + user + "发短消息</a>";
}else{
oo("link_3").innerHTML="<a href=javascript:show_login2(); >给" + user + "发短消息</a>";
}
oo("link_4").innerHTML="<a href=/List_" + xid + ".html target=_blank>查看" + user + "的评论列表</a>";
oo("oDiv").style.left=(el-10) + "px";
oo("oDiv").style.top=(et-3) + "px";
oo("oDiv").style.display='';
}
state=1;
}
}else if(sign==2){
state=0;
}
}

function asdfg(sign){
if(sign==1){
oo("oDiv").style.display='';
state=1;
}else if(sign==2){
if(oo("navigation_logo").style.display=='none'){
oo("oDiv").style.display='none';
}
state=0;
}
}
function asdfg_left(sign){
if(sign==1){
oo("oDiv").style.display='';
state=1;
}else if(sign==2){
if(oo("navigation_logo").style.display=='none'){
oo("oDiv").style.display='none';
}
state=0;
}
}
function asdfgh(sign,id){
if(sign==1){
oo("navigation_logo").style.display='';
state=1;
}else if(sign==2){
state=0;
}
}
function showarrow(sign){
if(sign==1){
if(oo("navigation_logo").style.display=='none'){
oo("arrow_img").style.background="url('http://www.iyumen.cn/images/imgs/avatar_right.gif')";
}
}else if(sign==2){
if(oo("navigation_logo").style.display=='none'){
if(oo("arrow_img").style.background=="url(http://www.iyumen.cn/images/imgs/avatar_left.gif)"){
oo("arrow_img").style.background="url('http://www.iyumen.cn/images/imgs/avatar_right.gif')";
}else{
oo("navigation_logo").style.display='none';
oo("arrow_img").style.background="url('http://www.iyumen.cn/images/imgs/avatar_right.gif')";
}
}else{
oo("navigation_logo").style.display='';
if(oo("navigation_logo").style.display=='none'){
oo("arrow_img").style.background="url('http://www.iyumen.cn/images/imgs/avatar_right.gif')";
}
}
}
}
function disnav(){
var dis=oo("navigation_logo").style.display;
if(dis=="none"){
oo("navigation_logo").style.display='';
oo("arrow_img").style.background="url('http://www.iyumen.cn/images/imgs/avatar_left.gif')";
ssh=sh+50;
showi=1;
}else{
oo("navigation_logo").style.display='none';
oo("arrow_img").style.background="url('http://www.iyumen.cn/images/imgs/avatar_right.gif')";
showi=0;
}
}
function disnav2(){
var dis=oo("navigation_logo").style.display;
if(dis=="none"){
oo("navigation_logo").style.display='';
oo("arrow_img").style.background="url('http://www.iyumen.cn/images/imgs/avatar_right.gif')";
ssh=sh+50;
showi=1;
}else{
oo("navigation_logo").style.display='none';
oo("arrow_img").style.background="url('http://www.iyumen.cn/images/imgs/avatar_left.gif')";
showi=0;
}
}
var obj=document.getElementById("d")
var t=new Object();
function show(){
obj.style.display="";
obj.style.width=document.body.clientWidth;
obj.style.height=document.body.clientHeight;
if(obj.filters.alpha.opacity>25){
obj.filters.alpha.opacity=25;
clearTimeout(t.timer1);
return;
}else{
obj.filters.alpha.opacity+=2;
t.timer1=setTimeout("show()",10)
}
return;
}
function hide(){
if (window.navigator.userAgent.indexOf("MSIE")>=1){
if(obj.filters.alpha.opacity<=0){
obj.filters.alpha.opacity=0;
obj.style.display="none"
clearTimeout(t.timer2)
return;
}else{
obj.filters.alpha.opacity-=2;
t.timer2=setTimeout("hide()",5);
}
}else{
obj.style.display="none"
}
return;
}

var sPop = null;
var postSubmited = false;
var smdiv = new Array();
var userAgent = navigator.userAgent.toLowerCase();
var is_webtv = userAgent.indexOf('webtv') != -1;
var is_kon = userAgent.indexOf('konqueror') != -1;
var is_mac = userAgent.indexOf('mac') != -1;
var is_saf = userAgent.indexOf('applewebkit') != -1 || navigator.vendor == 'Apple Computer, Inc.';
var is_opera = userAgent.indexOf('opera') != -1 && opera.version();
var is_moz = (navigator.product == 'Gecko' && !is_saf) && userAgent.substr(userAgent.indexOf('firefox') + 8, 3);
var is_ns = userAgent.indexOf('compatible') == -1 && userAgent.indexOf('mozilla') != -1 && !is_opera && !is_webtv && !is_saf;
var is_ie = (userAgent.indexOf('msie') != -1 && !is_opera && !is_saf && !is_webtv) && userAgent.substr(userAgent.indexOf('msie') + 5, 3);
var sw,sh;
sw=document.body.clientWidth
sh=document.body.clientHeight
var obj=document.getElementById("dssss")
var t=new Object();
function show(){
var screet=eet-300;
scrollTo(0,screet);
if (window.navigator.userAgent.indexOf("MSIE")>=1){
obj.style.display="";
oo("info_dsss").style.left=(document.body.offsetWidth-400)/2+"px";

oo("info_dsss").style.top=eet+"px";

oo("info_dsss").style.display="";
obj.style.width=oo("home").scrollWidth+"px";
obj.style.height=oo("home").scrollHeight+"px";
//obj.style.width=document.body.clientWidth;
//obj.style.height=document.body.clientHeight;
if(obj.filters.alpha.opacity>60){
obj.filters.alpha.opacity=60;
clearTimeout(t.timer1);
return;
}else{
obj.filters.alpha.opacity+=2;
show()
}
return;
}else{
obj.style.background="url(http://www.iyumen.cn/images/imgs/reg-pop-bg2.png)";
obj.style.display="";
//obj.style.width=document.body.clientWidth;
//obj.style.height=document.body.clientHeight;
oo("info_dsss").style.left=(document.body.offsetWidth-400)/2+"px";
oo("info_dsss").style.top=eet+"px";
oo("info_dsss").style.display="";
obj.style.width=oo("home").scrollWidth+"px";
obj.style.height=oo("home").scrollHeight+"px";
}
}
function show_out(){
scrollTo(0,0);
if (window.navigator.userAgent.indexOf("MSIE")>=1){
obj.style.display="";
oo("quit-alert").style.left=(document.body.offsetWidth-300)/2+"px";
oo("quit-alert").style.top="200px";
oo("quit-alert").style.display="";
obj.style.width=oo("home").scrollWidth+"px";
obj.style.height=oo("home").scrollHeight+"px";
//obj.style.width=document.body.clientWidth;
//obj.style.height=document.body.clientHeight;
if(obj.filters.alpha.opacity>60){
obj.filters.alpha.opacity=60;
clearTimeout(t.timer1);
return;
}else{
obj.filters.alpha.opacity+=2;
show_out()
}
return;
}else{
obj.style.background="url(http://www.iyumen.cn/images/imgs/reg-pop-bg2.png)";
obj.style.display="";
//obj.style.width=document.body.clientWidth;
//obj.style.height=document.body.clientHeight;
oo("quit-alert").style.left=(document.body.offsetWidth-300)/2+"px";
oo("quit-alert").style.top="200px";
oo("quit-alert").style.display="";
obj.style.width=oo("home").scrollWidth+"px";
obj.style.height=oo("home").scrollHeight+"px";
}
}
function in_party(){
scrollTo(0,0);
if (window.navigator.userAgent.indexOf("MSIE")>=1){
obj.style.display="";
oo("in_party").style.left=(document.body.offsetWidth-300)/2+"px";
oo("in_party").style.top="200px";
oo("in_party").style.display="";
obj.style.width=oo("home").scrollWidth+"px";
obj.style.height=oo("home").scrollHeight+"px";
//obj.style.width=document.body.clientWidth;
//obj.style.height=document.body.clientHeight;
if(obj.filters.alpha.opacity>60){
obj.filters.alpha.opacity=60;
clearTimeout(t.timer1);
return;
}else{
obj.filters.alpha.opacity+=2;
in_party()
}
return;
}else{
obj.style.background="url(http://www.iyumen.cn/images/imgs/reg-pop-bg2.png)";
obj.style.display="";
//obj.style.width=document.body.clientWidth;
//obj.style.height=document.body.clientHeight;
oo("in_party").style.left=(document.body.offsetWidth-300)/2+"px";
oo("in_party").style.top="200px";
oo("in_party").style.display="";
obj.style.width=oo("home").scrollWidth+"px";
obj.style.height=oo("home").scrollHeight+"px";
}
}
function hide_in(){
if (window.navigator.userAgent.indexOf("MSIE")>=1){
if(obj.filters.alpha.opacity<=0){
obj.filters.alpha.opacity=0;
obj.style.display="none"
oo("in_party").style.display="none"
clearTimeout(t.timer2)
return;
}else{
obj.filters.alpha.opacity-=2;
hide_in()
}
}else{
obj.style.display="none"
oo("in_party").style.display="none"
}
oo("in_party").style.top="200px";
return;
}
function show_black(){
scrollTo(0,0);
if (window.navigator.userAgent.indexOf("MSIE")>=1){
obj.style.display="";
oo("quit-black").style.left=(document.body.offsetWidth-300)/2+"px";
oo("quit-black").style.top="200px";
oo("quit-black").style.display="";
obj.style.width=oo("home").scrollWidth+"px";
obj.style.height=oo("home").scrollHeight+"px";
//obj.style.width=document.body.clientWidth;
//obj.style.height=document.body.clientHeight;
if(obj.filters.alpha.opacity>60){
obj.filters.alpha.opacity=60;
clearTimeout(t.timer1);
return;
}else{
obj.filters.alpha.opacity+=2;
show_black();
}
return;
}else{
obj.style.background="url(http://www.iyumen.cn/images/imgs/reg-pop-bg2.png)";
obj.style.display="";
//obj.style.width=document.body.clientWidth;
//obj.style.height=document.body.clientHeight;
oo("quit-black").style.left=(document.body.offsetWidth-300)/2+"px";
oo("quit-black").style.top="200px";
oo("quit-black").style.display="";
obj.style.width=oo("home").scrollWidth+"px";
obj.style.height=oo("home").scrollHeight+"px";
}
}
function show_add(){
scrollTo(0,0);
if (window.navigator.userAgent.indexOf("MSIE")>=1){
obj.style.display="";
oo("add-alert").style.left=(document.body.offsetWidth-300)/2+"px";
oo("add-alert").style.top="200px";
oo("add-alert").style.display="";
obj.style.width=oo("home").scrollWidth+"px";
obj.style.height=oo("home").scrollHeight+"px";
//obj.style.width=document.body.clientWidth;
//obj.style.height=document.body.clientHeight;
if(obj.filters.alpha.opacity>60){
obj.filters.alpha.opacity=60;
clearTimeout(t.timer1);
return;
}else{
obj.filters.alpha.opacity+=2;
show_add();
}
return;
}else{
// alert("ssdd")
obj.style.background="url(http://www.iyumen.cn/images/imgs/reg-pop-bg2.png)";
obj.style.display="";
//obj.style.width=document.body.clientWidth;
//obj.style.height=document.body.clientHeight;

oo("add-alert").style.left=(document.body.offsetWidth-300)/2+"px";
oo("add-alert").style.top="200px";
oo("add-alert").style.display="";
obj.style.width=oo("home").scrollWidth+"px";
obj.style.height=oo("home").scrollHeight+"px";
//alert(obj.style.width)
}
}
function show_login(){
scrollTo(0,0);
oo("login-out").style.display="";
oo("login-pop").style.display="";
}
function show_login2(){
oo("oDiv").style.display="none";
oo("navigation_logo").style.display="none";
oo("arrow_img").style.background="url('http://www.iyumen.cn/images/imgs/avatar_right.gif')";
showi=0;
scrollTo(0,0);
oo("login-out").style.display="";
oo("login-pop").style.display=""
}
function hide(){
if (window.navigator.userAgent.indexOf("MSIE")>=1){
if(obj.filters.alpha.opacity<=0){
obj.filters.alpha.opacity=0;
obj.style.display="none"
oo("info_dsss").style.display="none"
clearTimeout(t.timer2)
return;
}else{
obj.filters.alpha.opacity-=2;
hide()
}
}else{
obj.style.display="none"
oo("info_dsss").style.display="none"
}
return;
}
function hide_login(){
if (window.navigator.userAgent.indexOf("MSIE")>=1){
if(obj.filters.alpha.opacity<=0){
obj.filters.alpha.opacity=0;
obj.style.display="none"
oo("login-out").style.display="none";
oo("login-pop").style.display="none";
clearTimeout(t.timer2)
return;
}else{
obj.filters.alpha.opacity-=2;
hide_login()
}
}else{
obj.style.display="none"
oo("login-out").style.display="none";
oo("login-pop").style.display="none";
}
oo("login-out").style.top="95px";
return;
}

function hide_out(){
if (window.navigator.userAgent.indexOf("MSIE")>=1){
if(obj.filters.alpha.opacity<=0){
obj.filters.alpha.opacity=0;
obj.style.display="none"
oo("quit-alert").style.display="none"
clearTimeout(t.timer2)
return;
}else{
obj.filters.alpha.opacity-=2;
hide_out()
}
}else{
obj.style.display="none"
oo("quit-alert").style.display="none"
}
oo("quit-alert").style.top="200px";
return;
}
function hide_add(){
if (window.navigator.userAgent.indexOf("MSIE")>=1){
if(obj.filters.alpha.opacity<=0){
obj.filters.alpha.opacity=0;
obj.style.display="none"
oo("add-alert").style.display="none"
clearTimeout(t.timer2)
return;
}else{
obj.filters.alpha.opacity-=2;
hide_add()
}
}else{
obj.style.display="none"
oo("add-alert").style.display="none"
}
oo("add-alert").style.top="200px";
return;
}
function hide_black(){
if (window.navigator.userAgent.indexOf("MSIE")>=1){
if(obj.filters.alpha.opacity<=0){
obj.filters.alpha.opacity=0;
obj.style.display="none"
oo("quit-black").style.display="none"
clearTimeout(t.timer2)
return;
}else{
obj.filters.alpha.opacity-=2;
hide_black();
}
}else{
obj.style.display="none"
oo("quit-black").style.display="none"
}
oo("quit-black").style.top="200px";
return;
}
function login_url(op,partyid,groupid,styles){
var loghref=location.href ;
oo("login_url").innerHTML="<input type=hidden name=url value=" + loghref + ">";
actinfo(op);
setday(partyid,groupid,styles);
}