課程
/前端開發
/HTML/CSS
/圖片預加載
jquery版本不一樣有影響嗎?
2017-06-11
源自:圖片預加載 2-2
正在回答
沒有影響,應該你代碼哪里寫錯了。
武瑞祥 提問者
如果你要的是圖片預加載的那個效果,你的圖片預加載的代碼沒寫,沒有觸發load事件。不知道你想要什么效果。
<div class="box">?? ??? ?<img src="http://img2.3lian.com/2014/c7/12/d/77.jpg" alt="pic" id="img" />?? ??? ?<p>?? ??? ??? ?<a href="javascript:;" class="bth" data-control="prev">上一頁</a>?? ??? ??? ?<a href="javascript:;" class="bth" data-control="next">下一頁</a>?? ??? ?</p>?? ?</div>?? ??? ??? ?<script type="text/javascript" src="__PUBLIC__/home/js/jquery.1.4.2-min.js" ></script>
?var imgs=[?? ??? ??? ?'http://img2.3lian.com/2014/c7/12/d/77.jpg',?? ??? ??? ?'http://img04.tooopen.com/images/20130805/tooopen_10473021.jpg',?? ??? ??? ?'http://img1.3lian.com/2015/w7/98/d/22.jpg',?? ??? ??? ?'http://img1.3lian.com/2015/w7/90/d/1.jpg',?? ??? ??? ?'http://5.26923.com/download/pic/000/288/ed06bdc51d6a83df5919dcea5d261707.jpg'?? ?];?? ??? ?var index = 0,//當前是第幾張圖片?? ?var?? ?len = imgs.length;//圖片數組的長度?? ??? ?$('.bth').on('click', function(){//選擇按鈕??? 點擊事件?? ??? ??? ?if ('prev' === $(this).data('control')){//上一張? this表示按下按鈕通過data方法獲取control。?? ??? ??? ??? ?index = math.max(0,--index);?? ??? ??? ?}else{//下一張?? ??? ??? ??? ?index =math.min(len -1,++index);?? ??? ??? ?}?? ??? ??? ?document.title =(index + 1) + '/' +len;//顯示第幾張到title上面?? ??? ??? ?$("#img").attr('src',imgs[index]);//將圖片顯示出來?? ??? ?});
鄢棟
血小賤
舉報
預知發生的行為,提前加載需要的圖片,獲得更好的用戶體驗
3 回答寫jQuery插件這一課,看著很吃力,求問該彌補哪一塊的知識?
2 回答js代碼是?
2 回答this . _unoredered () 是自定義的嗎? jquery封裝對象都是這么寫的嗎?
2 回答有大神知道復制的那個jquery是干嘛用的嗎?
3 回答這行代碼看不明白
Copyright ? 2025 imooc.com All Rights Reserved | 京ICP備12003892號-11 京公網安備11010802030151號
購課補貼聯系客服咨詢優惠詳情
慕課網APP您的移動學習伙伴
掃描二維碼關注慕課網微信公眾號
2017-06-12
沒有影響,應該你代碼哪里寫錯了。
2017-06-13
如果你要的是圖片預加載的那個效果,你的圖片預加載的代碼沒寫,沒有觸發load事件。不知道你想要什么效果。
2017-06-13
<div class="box">
?? ??? ?<img src="http://img2.3lian.com/2014/c7/12/d/77.jpg" alt="pic" id="img" />
?? ??? ?<p>
?? ??? ??? ?<a href="javascript:;" class="bth" data-control="prev">上一頁</a>
?? ??? ??? ?<a href="javascript:;" class="bth" data-control="next">下一頁</a>
?? ??? ?</p>
?? ?</div>?? ?
?? ??? ?<script type="text/javascript" src="__PUBLIC__/home/js/jquery.1.4.2-min.js" ></script>
2017-06-13
?var imgs=[
?? ??? ??? ?'http://img2.3lian.com/2014/c7/12/d/77.jpg',
?? ??? ??? ?'http://img04.tooopen.com/images/20130805/tooopen_10473021.jpg',
?? ??? ??? ?'http://img1.3lian.com/2015/w7/98/d/22.jpg',
?? ??? ??? ?'http://img1.3lian.com/2015/w7/90/d/1.jpg',
?? ??? ??? ?'http://5.26923.com/download/pic/000/288/ed06bdc51d6a83df5919dcea5d261707.jpg'
?? ?];?? ?
?? ?var index = 0,//當前是第幾張圖片
?? ?var?? ?len = imgs.length;//圖片數組的長度
?? ??? ?$('.bth').on('click', function(){//選擇按鈕??? 點擊事件
?? ??? ??? ?if ('prev' === $(this).data('control')){//上一張? this表示按下按鈕通過data方法獲取control。
?? ??? ??? ??? ?index = math.max(0,--index);
?? ??? ??? ?}else{//下一張
?? ??? ??? ??? ?index =math.min(len -1,++index);
?? ??? ??? ?}
?? ??? ??? ?document.title =(index + 1) + '/' +len;//顯示第幾張到title上面
?? ??? ??? ?$("#img").attr('src',imgs[index]);//將圖片顯示出來
?? ??? ?});