この記事では、画像拡大ガラスの効果を実装するJSの方法について説明します。参照のためにそれを共有してください。特定の実装方法は次のとおりです。
次のようにコードをコピーします。<
<html xmlns = "http://www.w3.org/1999/xhtml">
<head>
<Title> JS Excisite Picture拡大ガラス効果</Title>
<meta http-equiv = "content-type" content = "text/html; charset = gb2312">
<! - <head>と</head> - >の間に次のコードを追加します
<style type = "text/css">
。テスト{
マージン:0 0 200px;
}
.test a {
フォントサイズ:14px;
色:#404040;
}
.test img {
境界線:#4b4b4b 1pxソリッド;
}
</style>
</head>
<body>
<! - <body>と</body> - >の間に次のコードを追加します
<スクリプトsrc = "/js/magnifier.js"> </script>
<div>
<h3> <a target = "_ blank" href = ""> picture i </a> </h3>
<img src = "/images // m01.jpg" bigsrc = "/images/1.jpg">
</div>
<div>
<h3> <a target = "_ blank" href = ""> picture II </a> </h3>
<img src = "/images // m02.jpg" bigsrc = "/images/2.jpg">
</div>
<div>
<h3> <a target = "_ blank" href = ""> picture iii </a> </h3>
<img src = "/images // m03.jpg" bigsrc = "/images/3.jpg">
</div>
</body>
</html>
サプリメント:Magnifier.jsプラグインをダウンロードするには、ここをクリックしてください。
この記事がみんなのJavaScriptプログラミングに役立つことを願っています。