0

我正在使用一些 JavaScript 来进行图像交换。

适用于桌面浏览器，但不适用于移动/较小的设备。

<p><img id="ima" src="images/web_assets/image1.jpg" width="270px" />
</p>
<p><a href="#" onmouseover="showT( 'images/web_assets/image1.jpg' )"><img src="images/web_assets/image1.jpg" width="84px" /></a>&nbsp;<a href="#" onmouseover="showT( 'images/web_assets/image2.jpg' )"><img src="images/web_assets/image2.jpg" width="84px" /></a>&nbsp;<a href="#" onmouseover="showT( 'images/web_assets/image3.jpg' )"><img src="images/web_assets/image3.jpg" width="84px" /></a>
</p>
<script type="text/javascript">
    // <![CDATA[
    function showT(image) {
        document.getElementById('ima').setAttribute('src', image)
    }
    // ]]>

</script>

知道如何在所有设备（即台式机、ipad、iphone、其他移动设备）上进行这项工作吗？

新代码：

<p><img id="ima" src="images/web_assets/image1.jpg" width="270px" />
</p>
<p><a href="#" onClick="showT( 'images/web_assets/image1.jpg' )"><img src="images/web_assets/image1.jpg" width="84px" /></a>&nbsp;<a href="#" onClick="showT( 'images/web_assets/image2.jpg' )"><img src="images/web_assets/image2.jpg" width="84px" /></a>&nbsp;<a href="#" onClick="showT( 'images/web_assets/image3.jpg' )"><img src="images/web_assets/image3.jpg" width="84px" /></a>
</p>
<script type="text/javascript">
    // <![CDATA[
    function showT(image) {
        document.getElementById('ima').setAttribute('src', image)
    }
    // ]]>

</script>

但是onclick，它会将页面返回到浏览器的顶部？！？！

4

1 回答 1

0

'onmouseover' 事件并不是让某些东西跨设备工作的最佳选择，因为您在移动设备、平板电脑上根本没有鼠标。

也许考虑让它在无鼠标设备的点击事件上工作？

于 2013-03-07T09:40:01.523 回答