利用jquery實現鼠標懸停放大顯示圖片代碼



41 163 55



特效描述:利用jquery實現 鼠標懸停 放大顯示圖片,利用jquery實現鼠標懸停放大顯示圖片代碼

代碼結構

1. 引入CSS

<link type="text/css" href="css/style.css" rel="stylesheet" />

2. 引入JS

<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/script.js"></script>

3. HTML代碼

<div class="applist">
	<ul class="clearfix" id="app_iphone_list">
		<li><a href="http://51qianduan.com/"><img src="images/01.jpg" name="經典GTD SlickTasks" ver="1.6" cate="效率" star="391" height="75" width="75"></a></li>
		<li><a href="http://51qianduan.com/"><img src="images/02.jpg" name="網格鏡頭 Grid Lens" ver="1.3.2" cate="攝影與錄像" star="8415" height="75" width="75"></a></li>
		<li><a href="http://51qianduan.com/"><img src="images/03.jpg" name="Jing顛覆音樂搜索" ver="1.0.3" cate="音樂" star="37" height="75" width="75"></a></li>
		<li><a href="http://51qianduan.com/"><img src="images/04.jpg" name="網易云閱讀-雜志新聞書籍" ver="1.5.1" cate="新聞" star="161393" height="75" width="75"></a></li>
		<li><a href="http://51qianduan.com/"><img src="images/05.jpg" name="行李管理 Busy Bags" ver="0.2" cate="游戲" star="1270" height="75" width="75"></a></li>
		<li><a href="http://51qianduan.com/"><img src="images/06.jpg" name="感染者 Infestor" ver="1.0" cate="游戲" star="0" height="75" width="75"></a></li>
		<li><a href="http://51qianduan.com/"><img src="images/07.jpg" name="僵尸與足球 Undead Soccer" ver="1.1" cate="游戲" star="105" height="75" width="75"></a></li>
		<li><a href="http://51qianduan.com/"><img src="images/08.jpg" name="最終幻想:勇氣 FINAL FANTASY ALL THE BRAVEST" ver="1.0.0" cate="游戲" star="5737" height="75" width="75"></a></li>
		<li><a href="http://51qianduan.com/"><img src="images/09.jpg" name="保衛奧林匹斯 Clash of the Olympians" ver="1.0" cate="游戲" star="8273" height="75" width="75"></a></li>
		<li><a href="http://51qianduan.com/"><img src="images/10.jpg" name="神廟狂奔2 Temple Run 2" ver="1.0" cate="游戲" star="134377" height="75" width="75"></a></li>
		<li><a href="http://51qianduan.com/"><img src="images/11.jpg" name="三重鎮" ver="1.21" cate="游戲" star="27180" height="75" width="75"></a></li>
		<li><a href="http://51qianduan.com/"><img src="images/12.jpg" name="飛信-免費短信" ver="3.1.0" cate="社交" star="858369" height="75" width="75"></a></li>
		<li><a href="http://51qianduan.com/"><img src="images/13.jpg" name="怪獸之戰-Monster Wars" ver="1.5" cate="游戲" star="12128" height="75" width="75"></a></li>
		<li><a href="http://51qianduan.com/"><img src="images/14.jpg" name="科迪的天空 Cordy Sky" ver="1.1.11735" cate="動作游戲" star="42368" height="75" width="75"></a></li>
		<li><a href="http://51qianduan.com/"><img src="images/15.jpg" name="兜兜友" ver="4.3.1" cate="社交" star="113542" height="75" width="75"></a></li>
		<li><a href="http://51qianduan.com/"><img src="images/16.jpg" name="死亡惡魔 Dead Grind" ver="1.2" cate="游戲" star="284" height="75" width="75"></a></li>
		<li><a href="http://51qianduan.com/"><img src="images/17.jpg" name="習慣清單 Habit List" ver="2.0.2" cate="效率" star="921" height="75" width="75"></a></li>
		<li><a href="http://51qianduan.com/"><img src="images/18.jpg" name="Any To Do - 印象筆記 任務時間管理" ver="1.28" cate="效率" star="2087" height="75" width="75"></a></li>
		<li><a href="http://51qianduan.com/"><img src="images/19.jpg" name="蟬游記-旅行時光機" ver="1.2" cate="旅行" star="1028" height="75" width="75"></a></li>
		<li><a href="http://51qianduan.com/"><img src="images/20.jpg" name="尋俠OL" ver="1.0.1" cate="游戲" star="1039" height="75" width="75"></a></li>
		<li><a href="http://51qianduan.com/"><img src="images/21.jpg" name="佳明i導航" ver="2.2" cate="導航" star="1257" height="75" width="75"></a></li>
		<li><a href="http://51qianduan.com/"><img src="images/22.jpg" name="死亡高爾夫 Death Golf?" ver="1.0" cate="游戲" star="569" height="75" width="75"></a></li>
		<li><a href="http://51qianduan.com/"><img src="images/23.jpg" name="戰斗吧,奧尼爾 ShaqDown" ver="1.4" cate="游戲" star="31890" height="75" width="75"></a></li>
		<li><a href="http://51qianduan.com/"><img src="images/24.jpg" name="空手道 Karateka" ver="1.01" cate="游戲" star="4777" height="75" width="75"></a></li>
		<li><a href="http://51qianduan.com/"><img src="images/25.jpg" name="小小武士 Little Warrior" ver="1.4" cate="游戲" star="601" height="75" width="75"></a></li>
		<li><a href="http://51qianduan.com/"><img src="images/26.jpg" name="吵醒貓貓 Wake the Cat" ver="1.1" cate="游戲" star="53589" height="75" width="75"></a></li>
		<li><a href="http://51qianduan.com/"><img src="images/27.jpg" name="莉莉向前沖 Little Amazon" ver="1.0" cate="游戲" star="12543" height="75" width="75"></a></li>
		<li><a href="http://51qianduan.com/"><img src="images/28.jpg" name="僵尸終結者 I Am Vegend: Zombiegeddon" ver="1.0" cate="游戲" star="1134" height="75" width="75"></a></li>
		<li><a href="http://51qianduan.com/"><img src="images/29.jpg" name="看球啦" ver="2.4" cate="體育" star="12901" height="75" width="75"></a></li>
		<li><a href="http://51qianduan.com/"><img src="images/30.jpg" name="澤諾尼亞傳奇5" ver="1.0.0" cate="游戲" star="9327" height="75" width="75"></a></li>
		<li><a href="http://51qianduan.com/"><img src="images/31.jpg" name="網易新聞" ver="3.0.2" cate="新聞" star="1100246" height="75" width="75"></a></li>
		<li><a href="http://51qianduan.com/"><img src="images/32.jpg" name="Instant110" ver="2.1.0" cate="攝影與錄像" star="1579" height="75" width="75"></a></li>
		<li><a href="http://51qianduan.com/"><img src="images/33.jpg" name="亞特戰爭2 AREL WARS 2" ver="1.0.1" cate="游戲" star="17641" height="75" width="75"></a></li>
		<li><a href="http://51qianduan.com/"><img src="images/34.jpg" name="空中嬌娃 Bombshells: Hell′s Belles" ver="2.0.1" cate="游戲" star="16258" height="75" width="75"></a></li>
		<li><a href="http://51qianduan.com/"><img src="images/35.jpg" name="成百上千 Hundreds" ver="1.1" cate="游戲" star="14884" height="75" width="75"></a></li>
		<li><a href="http://51qianduan.com/"><img src="images/36.jpg" name="傳奇戰機 Legendary Fighters" ver="1.0" cate="游戲" star="2613" height="75" width="75"></a></li>
		<li><a href="http://51qianduan.com/"><img src="images/37.jpg" name="壞習慣:康復 Bad Habit: Rehab" ver="1.01" cate="游戲" star="1505" height="75" width="75"></a></li>
		<li><a href="http://51qianduan.com/"><img src="images/38.jpg" name="玩具守衛者 Toy Defender R" ver="1.00.00" cate="游戲" star="410" height="75" width="75"></a></li>
		<li><a href="http://51qianduan.com/"><img src="images/39.jpg" name="槍手跑酷 Run'n'Gun" ver="1.0.0" cate="游戲" star="658" height="75" width="75"></a></li>
		<li><a href="http://51qianduan.com/"><img src="images/40.jpg" name="VSCO CAM" ver="1.2.8" cate="攝影與錄像" star="188" height="75" width="75"></a></li>
		<li><a href="http://51qianduan.com/"><img src="images/41.jpg" name="Today Weather" ver="1.1.1" cate="天氣" star="0" height="75" width="75"></a></li>
		<li><a href="http://51qianduan.com/"><img src="images/42.jpg" name="丟糖果 Om Nom: Candy Flick" ver="1.0" cate="娛樂" star="59054" height="75" width="75"></a></li>
		<li><a href="http://51qianduan.com/"><img src="images/43.jpg" name="LINE camera" ver="3.1.1" cate="攝影與錄像" star="146505" height="75" width="75"></a></li>
		<li><a href="http://51qianduan.com/"><img src="images/44.jpg" name="手寫便簽 GOLD" ver="6.0`" cate="商業" star="6005" height="75" width="75"></a></li>
		<li><a href="http://51qianduan.com/"><img src="images/45.jpg" name="精益六西格瑪評論" ver="1.1" cate="商業" star="179" height="75" width="75"></a></li>
		<li><a href="http://51qianduan.com/"><img src="images/46.jpg" name="窮人通脹富人通縮" ver="V1.6" cate="商業" star="1046" height="75" width="75"></a></li>
		<li><a href="http://51qianduan.com/"><img src="images/47.jpg" name="PDF閱讀器" ver="1.0" cate="商業" star="0" height="75" width="75"></a></li>
		<li><a href="http://51qianduan.com/"><img src="images/48.jpg" name="掌上公文包(專業版) - 強大的文件查看和管理工具,讓手機變U盤" ver="1.3" cate="商業" star="30" height="75" width="75"></a></li>
		<li><a href="http://51qianduan.com/"><img src="images/49.jpg" name="澳門天氣報告 Macau Weather Report" ver="1.3" cate="天氣" star="554" height="75" width="75"></a></li>
		<li><a href="http://51qianduan.com/"><img src="images/50.jpg" name="Climate Whiz? - The Weather Tool ?.  Great for travel, retirement and outdoor activity planning." ver="1.0.1" cate="天氣" star="4" height="75" width="75"></a></li>
		<li class="app_more"><a href="http://51qianduan.com/"><span>更多應用</span> <span class="app_more_arr"></span> </a></li>
	</ul>
	<div class="appdetail">
		<div class="appdetail_m"></div>
		<div class="appdetail_w">
			<div class="appdetail_n">
				<h3></h3>
				<p class="appdetail_v"></p>
				<p class="appdetail_c"></p>
				<p class="appdetail_s"></p>
			</div>
			<a href="http://51qianduan.com/" class="appdetail_h"><img src="" height="140" width="140"></a>
		</div>
	</div>
</div>
<div style="text-align:center;clear:both">
</div>



用戶評論
大牛,別默默的看了,快登錄幫我點評一下吧!:)      登錄 | 注冊


熱門標簽: 浮動 懸浮 懸浮層 懸浮框 浮動層 浮動框 浮動插件 懸浮插件 彈出層拖動 窗口 彈出 彈窗 彈出層 提示框 對話框 遮罩 遮罩層 彈窗插件 滑動星星打分 浮動提示框 放大縮小 變大變小 放大 縮小 變大 變小 縮放 縮放切換 其他 鼠標懸停 圖片廣告 圖片放大縮小 圖片縮放 圖片大小 圖片放大 圖片縮小 圖片變大 圖片變小 浮動提示框
?
×
×

注冊

官方QQ群

掃描上面二維碼加微信群

官方QQ群

jQuery/js討論群
群號:642649996
Css3+Html5討論群
群號:322131262

加群請備注:從官網了解到

湖北30选5开奖结果走势图表