»
Tiếng AnhTiếng PhápTiếng Việt

In - Đổi ảnh khi rê chuột - JavaScriptBank.com

Phiên bản đầy đủ: jsB@nk » Hình ảnh » Đổi ảnh khi rê chuột
URL: https://www.javascriptbank.com/dom-image-rollover-v3-index.html

Đổi ảnh khi rê chuột © JavaScriptBank.comHiệu ứng này có chức năng đổi ảnh khi người dùng rê chuột đến hình ảnh đã được gán thuộc tính class. Hiệu ứng này có thể họat động trong các trình duyệt hỗ trợ DOM (Document Object Model).

Phiên bản đầy đủ: jsB@nk » Hình ảnh » Đổi ảnh khi rê chuột
URL: https://www.javascriptbank.com/dom-image-rollover-v3-index.html



JavaScript
<script type="text/javascript">//=====================================================================//  DOM Image Rollover v3 (hover)////  Demo: http://chrispoole.com/scripts/dom_image_rollover_hover//=====================================================================//  copyright Chris Poole//  http://chrispoole.com//  This software is licensed under the MIT License //  <http://opensource.org/licenses/mit-license.php>//=====================================================================function domRollover() {if (navigator.userAgent.match(/Opera (\S+)/)) {var operaVersion = parseInt(navigator.userAgent.match(/Opera (\S+)/)[1]);}if (!document.getElementById||operaVersion <7) return;var imgarr=document.getElementsByTagName('img');var imgPreload=new Array();var imgSrc=new Array();var imgClass=new Array();for (i=0;i<imgarr.length;i++){if (imgarr[i].className.indexOf('domroll')!=-1){imgSrc[i]=imgarr[i].getAttribute('src');imgClass[i]=imgarr[i].className;imgPreload[i]=new Image();if (imgClass[i].match(/domroll (\S+)/)) {imgPreload[i].src = imgClass[i].match(/domroll (\S+)/)[1]}imgarr[i].setAttribute('xsrc', imgSrc[i]);imgarr[i].onmouseover=function(){this.setAttribute('src',this.className.match(/domroll (\S+)/)[1])}imgarr[i].onmouseout=function(){this.setAttribute('src',this.getAttribute('xsrc'))}}}}domRollover();</script><!--    This script downloaded from www.JavaScriptBank.com    Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->


HTML
<img src="offgreen.gif" class="domroll ongreen.gif"><!--    This script downloaded from www.JavaScriptBank.com    Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->


Files
http://javascriptbank.com/javascript/image/DOM_Image_Rollover_v3/ongreen.gifhttp://javascriptbank.com/javascript/image/DOM_Image_Rollover_v3/offgreen.gif