发布于 2017-06-26 02:36:35 | 107 次阅读 | 评论: 0 | 来源: 网友投递

这里有新鲜出炉的Javascript教程,程序狗速度看过来!

JavaScript客户端脚本语言

Javascript 是一种由Netscape的LiveScript发展而来的原型化继承的基于对象的动态类型的区分大小写的客户端脚本语言,主要目的是为了解决服务器端语言,比如Perl,遗留的速度问题,为客户提供更流畅的浏览效果。


一个实用的简单的鼠标划过切换效果,附带ie6兼容png js
上次帮朋友写过的一个简单切换效果,超级简单,但也比较适用.因为用到了CSS Sprite技术,DEMO中附带了IE6兼容png的JS.

核心JavaScript代码:点此查看DEMO
 
//@Mr.Think获取对象属性兼容方法 
function $(objectId) { 
if(document.getElementById && document.getElementById(objectId)) { 
return document.getElementById(objectId);// W3C DOM 
} else if (document.all && document.all(objectId)) { 
return document.all(objectId);// MSIE 4 DOM 
} else if (document.layers && document.layers[objectId]) { 
return document.layers[objectId];// NN 4 DOM..this won't find nested layers 
} else { 
return false; 
} 
} 
//@Mr.Think切换显示文字和背景图位置 
function iLeftNav(type) { 
var inum,i_navinfo=$("i_navinfo"); 
if(type=="writeblog"){ 
inum="-300px"; 
}else if(type=="sharepic"){ 
inum="-600px"; 
}else if(type=="writemsg"){ 
inum="-900px"; 
}else{ 
inum="-300px"; 
} 
i_navinfo.innerHTML=$(type).innerHTML; 
i_navinfo.style.backgroundPosition=inum+" 0"; 
} 
//@Mr.Think加载鼠标莫过事件 
window.onload=function(){ 
var liitem=$("i_blognav").getElementsByTagName("li"); 
for(var i=0; i<liitem.length; i++){ 
liitem[0].onmouseover=function(){iLeftNav("writeblog")} 
liitem[1].onmouseover=function(){iLeftNav("sharepic")} 
liitem[2].onmouseover=function(){iLeftNav("writemsg")} 
} 
} 

本文是一个简易的鼠标莫过效果,用CSS亦可以实现,但相对烦琐. 如果需要更酷更炫一点的效果,可点此查看cssrain写的基于jQuery的气泡提示效果.
原文发布于Mr.Think的个人博客: http://mrthink.net/script-mousechange-simple/

最新网友评论  共有(0)条评论 发布评论 返回顶部

Copyright © 2007-2017 PHPERZ.COM All Rights Reserved   冀ICP备14009818号  版权声明  广告服务