0
4

1 回答 1

1

最简单的方法:HTML:

<span id="My_ID"><img class="My_img" src="/images/image1.jpg" alt="The name of image" /></span>

JavaScript 和 JQUERY(不是必需的,但我将其用于浏览器兼容性):

var first= true;
$('.My_img').hover(function(){    
    if(first == true){
     //First time this prevent Dulicated runing and shows errors
        first = false;//it is not thew first time anymore
var alt = $('.My_img').attr('alt');//Get the img alt
    var src = $('.My_img').attr('src');//Get the img src
    document.getElementById('My_ID').innerHTML = '<a href="' + src + '" target="_self" rel="zoom" title="' + alt + '"  ><img src="' + src +'" alt="' + alt + '" width="200" height="100"></a>';
    }
});

为了证明上述她是一个小提琴:

http://jsfiddle.net/Mh9Np/

很简单,但是正如每个人所说的那样,innerHTML 是一种不好的做法,所以我会给你一个关于另一种方式的想法:(Samse HTML)

1-将 img 存储在变量中

2-将 alt 和 src 属性存储在变量中。

2-创建一个元素。

3-在 alt 和 src 变量的帮助下为其设置所需的属性。

4-将img附加到a。

5-将 a 附加到跨度。

6-删除原始img。//可选它可能有助于解决一些样式问题。

于 2013-09-06T09:25:58.700 回答