jQuery彈出圖片視頻插件



81 322 108



特效描述:jQuery 彈出圖片視頻,jQuery彈出圖片視頻插件

代碼結構

1. 引入JS

<script src="js/jquery-1.11.1.min.js"></script>
<script src="js/jquery.poptrox.min.js"></script>

2. HTML代碼

		<div id="wrapper">
			<h1>Demo #1</h1>
			<div id="gallery">
				<!-- Regular images -->
					<a href="images/1.jpg"><img src="images/1_thumb.jpg" alt="" title=" (#1)" /></a>
					<a href="images/2.jpg"><img src="images/2_thumb.jpg" alt="" title=" (#2)" /></a>
					<a href="images/3.jpg"><img src="images/3_thumb.jpg" alt="" title=" (#3)" /></a>
				<!-- YouTube: Must be in share format (http://youtu.be/xxxxxxxxxxx) -->
					<a href="http://youtu.be/loGm3vT8EAQ" data-poptrox="youtube,800x480"><img src="images/youtube.png" alt="" title="A YouTube Video" /></a>
				<!-- Vimeo: Must be in share format (http://vimeo.com/xxxxxxxx) -->
					<a href="http://vimeo.com/22439234" data-poptrox="vimeo,800x480"><img src="images/vimeo.png" alt="" title="A Vimeo Video" /></a>
				<!-- Soundcloud: Must be in share format (https://api.soundcloud.com/tracks/xxxxxxxx) -->
					<a href="http://www.cqetom.live//tracks/93549370" data-poptrox="soundcloud"><img src="images/soundcloud.png" alt="" title="A Soundcloud Track" /></a>
				<!-- Brightcove: Must be in share format (http://bcove.me/xxxxxxxx) -->
					<a href="http://bcove.me/qly3wjdw" data-poptrox="bcove,636x360"><img src="images/brightcove.png" alt="" title="A Brightcove Video" /></a>
				<!-- Wistia: Must be in embed format (http://fast.wistia.net/embed/iframe/xxxxxxxxxx) -->
					<a href="http://www.cqetom.live//embed/iframe/fe8t32e27x" data-poptrox="wistia,800x480"><img src="images/wistia.png" alt="" title="A Wistia Video" /></a>
				<!-- IFRAME: Link straight to whatever page you want to open -->
					<a href="iframe.html" data-poptrox="iframe,600x400"><img src="images/iframe.png" alt="" title="An IFRAME" /></a>
				<!-- AJAX: Link to whatever content you want to pull in (must be on the same domain)  -->
					<!--<a href="path/to/whatever.html" data-poptrox="ajax,600x400"><img src="path/to/thumbnail.jpg" alt="" title="AJAX content" /></a>-->
				<!-- Ignore: Use this if you want a particular thumbnail to just link out to something -->
					<a href="www.cqetom.live" data-poptrox="ignore"><img src="images/ignore.png" alt="" /></a>
			</div>
		</div>



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


熱門標簽: 彈出層拖動 窗口 彈出 彈窗 彈出層 提示框 對話框 遮罩 遮罩層 彈窗插件 滑動星星打分 其他 提示框/彈出層 播放器
?
×
×

注冊

官方QQ群

掃描上面二維碼加微信群

官方QQ群

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

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

老夫子电子