JavaScript實(shí)現(xiàn)簡單圖片翻轉(zhuǎn)的方法
更新時(shí)間：2015年04月17日 09:44:03 作者：dingding
這篇文章主要介紹了JavaScript實(shí)現(xiàn)簡單圖片翻轉(zhuǎn)的方法,涉及javascript操作圖片與數(shù)組的相關(guān)技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下
本文實(shí)例講述了JavaScript實(shí)現(xiàn)簡單圖片翻轉(zhuǎn)的方法。分享給大家供大家參考。具體如下：
這里先取兩個(gè)命名smirk1.jpg和smirk2.jpg同樣大小的圖像
然后運(yùn)行下面的代碼，可以實(shí)現(xiàn)簡單的圖片翻轉(zhuǎn)
<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>
希望本文所述對(duì)大家的javascript程序設(shè)計(jì)有所幫助。
相關(guān)文章
這篇文章主要介紹了JSX在render函數(shù)中的應(yīng)用詳解，文中通過示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2019-09-09
這篇文章主要介紹了使用controller接收js傳過來的參數(shù)問題，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教2023-02-02
微信公眾號(hào)-獲取用戶信息（網(wǎng)頁授權(quán)獲?。?shí)現(xiàn)步驟
這篇文章主要介紹了微信公眾號(hào)-獲取用戶信息（網(wǎng)頁授權(quán)獲取）實(shí)現(xiàn)步驟的相關(guān)資料,需要的朋友可以參考下2016-10-10
本文主要介紹了Webpack之plugin的使用，文中通過示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2023-02-02
使用Fetch API時(shí)獲取404錯(cuò)誤的解決方案
在現(xiàn)代Web開發(fā)中,Fetch API 是用于執(zhí)行網(wǎng)絡(luò)請(qǐng)求的主要工具之一,它提供了一種基于Promise的簡潔語法,使得異步操作更加直觀和易于管理,本文將詳細(xì)探討在使用Fetch API時(shí)獲取404錯(cuò)誤的原因、如何檢測和處理這些錯(cuò)誤,以及最佳實(shí)踐,需要的朋友可以參考下2024-12-12
這篇文章主要為大家詳細(xì)介紹了JS實(shí)現(xiàn)視頻彈幕效果，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2021-09-09
本文主要介紹了JavaScript制作年歷的示例代碼,文中通過示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2012-05-05
JS判斷字符串變量是否含有某個(gè)字串的實(shí)現(xiàn)方法
下面小編就為大家?guī)硪黄狫S判斷字符串變量是否含有某個(gè)字串的實(shí)現(xiàn)方法。小編覺得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧2016-06-06
javascript 動(dòng)態(tài)修改css樣式方法匯總(四種方法)
為了達(dá)到某種特殊的效果我們需要用Javascript動(dòng)態(tài)的去更改某一個(gè)標(biāo)簽的Css屬性，如何動(dòng)態(tài)修改css樣式呢？面對(duì)這個(gè)問題，小編帶領(lǐng)大家來解決javascript動(dòng)態(tài)修改css樣式，小伙伴們都快來學(xué)習(xí)吧2015-08-08
js實(shí)現(xiàn)的xml對(duì)象轉(zhuǎn)json功能示例
這篇文章主要介紹了js實(shí)現(xiàn)的xml對(duì)象轉(zhuǎn)json功能,結(jié)合實(shí)例形式分析了javascript轉(zhuǎn)換成xml所涉及的字符串、對(duì)象、數(shù)組、遍歷等操作技巧與使用方法,需要的朋友可以參考下2016-12-12