jQuery點縮略圖彈出層顯示大圖片

更新時間：2015年02月13日 11:15:01 投稿：hebedich

這篇文章主要介紹了jQuery點縮略圖彈出層顯示大圖片的方法，思路非常不錯，這里推薦給大家。

2015年繁忙的一月份，無更多時間去學(xué)習(xí)ASP.NET MVC程序，二月份又是中國的新年，長達半個月的假期，望回到老家中，在無電腦無網(wǎng)絡(luò)的日子里，能有更多時間陪伴年邁的父母親。

今天學(xué)習(xí)jQuery的相關(guān)知識，應(yīng)用到圖片上，用戶點一點圖片，放大顯示圖片功能。

創(chuàng)建一個控制器FebY15Controller：

接下來創(chuàng)建視圖Index:

標記1，添加圖片樣式：

標記2，添加htm代碼，原片顯示以及放大圖片的占位div標簽：

標記3，引用jQuery類庫。

標記4，編寫jQuery程序：

下面是動態(tài)演示：

本篇中，可以學(xué)到j(luò)Query的click事件。使用標簽.樣式類獲取對象(img.thumb)。使用$(this)來代碼對象本身。.attr("scr")獲取圖片src圖片路徑。還有一個就是.animate()動態(tài)事件。

您可能感興趣的文章:

相關(guān)文章

jQuery實現(xiàn)的圖文高亮滾動切換特效實例
這篇文章主要介紹了jQuery實現(xiàn)的圖文高亮滾動切換特效,涉及jquery基于鼠標事件針對頁面元素遍歷與動態(tài)操作的相關(guān)技巧,具有一定參考借鑒價值,需要的朋友可以參考下
2015-08-08
用Jquery實現(xiàn)滾動新聞
此文主要用Jquery實現(xiàn)滾動新聞,Jquery的強大功能，幾行代碼即可實現(xiàn)，需要的朋友可以參考下
2014-02-02
基于jquery實現(xiàn)的類似百度搜索的輸入框自動完成功能
自動完成功能是指：類似百度搜索之類的輸入一個詞的一部分后就自動提示，然后用戶可以選擇，不需要再輸入剩余部分。
2011-08-08
基于Jquery的文字滾動跑馬燈插件(一個頁面多個滾動區(qū))
文字逐行或多行滾動跑馬燈插件，基于Jquery。命名為Jquery.RollTitle。支持在一個頁面聲明多個滾動區(qū) (就為了要這點才寫了這個)
2010-07-07
為JQuery EasyUI 表單組件增加焦點切換功能的方法
下面小編就為大家?guī)硪黄獮镴Query EasyUI 表單組件增加焦點切換功能的方法。小編覺得挺不錯的，現(xiàn)在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧
2017-04-04
jquery實現(xiàn)擲骰子小游戲
這篇文章主要為大家詳細介紹了jquery實現(xiàn)擲骰子小游戲，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下
2019-10-10
jQuery點擊按鈕彈出遮罩層且內(nèi)容居中特效
這篇文章主要介紹了jQuery點擊按鈕彈出遮罩層且內(nèi)容居中特效，需要的朋友可以參考下
2015-12-12
jquery.form.js用法之清空form的方法
這篇文章主要介紹了jquery.form.js清空form的方法,需要的朋友可以參考下
2014-03-03
jQuery動態(tài)添加li標簽并添加屬性和綁定事件方法
下面小編就為大家分享一篇jQuery動態(tài)添加li標簽并添加屬性和綁定事件方法，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧
2018-02-02
jQuery中[attribute*=value]選擇器用法實例
這篇文章主要介紹了jQuery中[attribute*=value]選擇器用法,實例分析了[attribute*=value]選擇器的功能、定義及匹配給定的屬性包含某些值的元素的使用技巧,具有一定參考借鑒價值,需要的朋友可以參考下
2014-12-12