ホームページ > 記事 > ウェブフロントエンド > 単純な画像反転を実装する JavaScript メソッド_JavaScript スキル
この記事の例では、JavaScript を使用して簡単な画像反転を実装する方法を説明します。皆さんの参考に共有してください。詳細は以下の通りです。
ここに、smirk1.jpg と smirk2.jpg という名前の同じサイズの 2 つの画像があります
次に、次のコードを実行して、単純な画像反転を実現します
<script type="text/javascript"> var revert = new Array(); var inames = new Array('smirk'); // Preload if (document.images) { var flipped = new Array(); for(i=0; i< inames.length; i++) { flipped[i] = new Image(); flipped[i].src = ""+inames[i]+"2.JPG"; } } function over(num) { if(document.images) { revert[num] = document.images[inames[num]].src; document.images[inames[num]].src = flipped[num].src; } } function out(num) { if(docu <script type="text/javascript"> var revert = new Array(); var inames = new Array('smirk'); // Preload if (document.images) { var flipped = new Array(); for(i=0; i< inames.length; i++) { flipped[i] = new Image(); flipped[i].src = ""+inames[i]+"2.JPG"; } } function over(num) { if(document.images) { revert[num] = document.images[inames[num]].src; document.images[inames[num]].src = flipped[num].src; } } function out(num) { if(document.images) document.images[inames[num]].src = revert[num]; } </script>
この記事が皆様の JavaScript プログラミング設計に役立つことを願っています。