jquery赞助商图标翻转特效代码下载



如需定制开发(网站开发、二次开发)在线咨询,请点击>> QQ:753511799

5 16 6



特效描述:图标翻转。jquery赞助商图标翻转特效代码下载

代码结构

1. 引入CSS

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

2. 引入JS

<script type="text/javascript" src="js/jquery-1.4.2.min.js"></script>
<script type="text/javascript" src="http://ajax.51qianduan.com/ajax/libs/jqueryui/1.7.2/jquery-ui.min.js"></script>
<script type="text/javascript" src="js/jquery.flip.min.js"></script>
<script type="text/javascript" src="js/script.js"></script>

3. HTML代码

<div id="main">
	<div class="sponsorListHolder">
				<div class="sponsor" title="Click to flip">
					<div class="sponsorFlip">
						<img src="img/sponsors/facebook.png" alt="More about facebook" />
					</div>
					<div class="sponsorData">
						<div class="sponsorDescription">
							The biggest social network in the world.
						</div>
						<div class="sponsorURL">
							<a href="https://www.51qianduan.com/" target="_blank">51前端</a>
						</div>
					</div>
				</div>
				<div class="sponsor" title="Click to flip">
					<div class="sponsorFlip">
						<img src="img/sponsors/hp.png" alt="More about hp" />
					</div>
					<div class="sponsorData">
						<div class="sponsorDescription">
							One of the biggest computer manufacturers.
						</div>
						<div class="sponsorURL">
							<a href="https://www.51qianduan.com/" target="_blank">51前端</a>
						</div>
					</div>
				</div>
				<div class="sponsor" title="Click to flip">
					<div class="sponsorFlip">
						<img src="img/sponsors/sony.png" alt="More about sony" />
					</div>
					<div class="sponsorData">
						<div class="sponsorDescription">
							A global multibillion electronics and entertainment company 
						</div>
						<div class="sponsorURL">
							<a href="https://www.51qianduan.com/" target="_blank">51前端</a>
						</div>
					</div>
				</div>
				<div class="sponsor" title="Click to flip">
					<div class="sponsorFlip">
						<img src="img/sponsors/cisco.png" alt="More about cisco" />
					</div>
					<div class="sponsorData">
						<div class="sponsorDescription">
							The biggest networking and communications technology manufacturer.
						</div>
						<div class="sponsorURL">
							<a href="https://www.51qianduan.com/" target="_blank">51前端</a>
						</div>
					</div>
				</div>
				<div class="sponsor" title="Click to flip">
					<div class="sponsorFlip">
						<img src="img/sponsors/ea.png" alt="More about ea" />
					</div>
					<div class="sponsorData">
						<div class="sponsorDescription">
							The biggest computer game manufacturer.
						</div>
						<div class="sponsorURL">
							<a href="https://www.51qianduan.com/" target="_blank">51前端</a>
						</div>
					</div>
				</div>
				<div class="sponsor" title="Click to flip">
					<div class="sponsorFlip">
						<img src="img/sponsors/mysql.png" alt="More about mysql" />
					</div>
					<div class="sponsorData">
						<div class="sponsorDescription">
							The most popular open source database engine.
						</div>
						<div class="sponsorURL">
							<a href="https://www.51qianduan.com/" target="_blank">51前端</a>
						</div>
					</div>
				</div>
				<div class="sponsor" title="Click to flip">
					<div class="sponsorFlip">
						<img src="img/sponsors/canon.png" alt="More about canon" />
					</div>
					<div class="sponsorData">
						<div class="sponsorDescription">
							Imaging and optical technology manufacturer.
						</div>
						<div class="sponsorURL">
							<a href="https://www.51qianduan.com/" target="_blank">51前端</a>
						</div>
					</div>
				</div>
				<div class="sponsor" title="Click to flip">
					<div class="sponsorFlip">
						<img src="img/sponsors/digg.png" alt="More about digg" />
					</div>
					<div class="sponsorData">
						<div class="sponsorDescription">
							One of the most popular web 2.0 social networks.
						</div>
						<div class="sponsorURL">
							<a href="https://www.51qianduan.com/" target="_blank">51前端</a>
						</div>
					</div>
				</div>
				<div class="sponsor" title="Click to flip">
					<div class="sponsorFlip">
						<img src="img/sponsors/microsoft.png" alt="More about microsoft" />
					</div>
					<div class="sponsorData">
						<div class="sponsorDescription">
							One of the top software companies of the world.
						</div>
						<div class="sponsorURL">
							<a href="https://www.51qianduan.com/" target="_blank">51前端</a>
						</div>
					</div>
				</div>
				<div class="sponsor" title="Click to flip">
					<div class="sponsorFlip">
						<img src="img/sponsors/yahoo.png" alt="More about yahoo" />
					</div>
					<div class="sponsorData">
						<div class="sponsorDescription">
							The most popular network of social media portals and services.
						</div>
						<div class="sponsorURL">
							<a href="https://www.51qianduan.com/" target="_blank">51前端</a>
						</div>
					</div>
				</div>
				<div class="sponsor" title="Click to flip">
					<div class="sponsorFlip">
						<img src="img/sponsors/vimeo.png" alt="More about vimeo" />
					</div>
					<div class="sponsorData">
						<div class="sponsorDescription">
							A popular video-centric social networking site.
						</div>
						<div class="sponsorURL">
							<a href="https://www.51qianduan.com/" target="_blank">51前端</a>
						</div>
					</div>
				</div>
				<div class="sponsor" title="Click to flip">
					<div class="sponsorFlip">
						<img src="img/sponsors/ebay.png" alt="More about ebay" />
					</div>
					<div class="sponsorData">
						<div class="sponsorDescription">
							The biggest online auction and shopping websites.
						</div>
						<div class="sponsorURL">
							<a href="https://www.51qianduan.com/" target="_blank">51前端</a>
						</div>
					</div>
				</div>
				<div class="sponsor" title="Click to flip">
					<div class="sponsorFlip">
						<img src="img/sponsors/adobe.png" alt="More about adobe" />
					</div>
					<div class="sponsorData">
						<div class="sponsorDescription">
							The leading software developer targeted at web designers and developers.
						</div>
						<div class="sponsorURL">
							<a href="https://www.51qianduan.com/" target="_blank">51前端</a>
						</div>
					</div>
				</div>
				<div class="sponsor" title="Click to flip">
					<div class="sponsorFlip">
						<img src="img/sponsors/dell.png" alt="More about dell" />
					</div>
					<div class="sponsorData">
						<div class="sponsorDescription">
							One of the biggest computer developers and assemblers.
						</div>
						<div class="sponsorURL">
							<a href="https://www.51qianduan.com/" target="_blank">51前端</a>
						</div>
					</div>
				</div>
				<div class="sponsor" title="Click to flip">
					<div class="sponsorFlip">
						<img src="img/sponsors/google.png" alt="More about google" />
					</div>
					<div class="sponsorData">
						<div class="sponsorDescription">
							The company that redefined web search.
						</div>
						<div class="sponsorURL">
							<a href="https://www.51qianduan.com/" target="_blank">51前端</a>
						</div>
					</div>
				</div>
    	<div class="clear"></div>
    </div>
</div>



用户评论
大牛,别默默的看了,快登录帮我点评一下吧!:)      登录 | 注册


热门标签: 文字叠加 图片叠加 叠加浮动层 重叠层叠叠加

×
×
51前端

注册

×
绑定手机

请绑定手机号,在继续操作

×
单次下载支付

应付金额:279

支付完成后,回到下载页面,在进行下载

官方QQ群
意见反馈
qq群

扫描上面二维码加微信群

官方QQ群

jQuery/js讨论群
群号:642649996
Css3+Html5讨论群
群号:322131262

加群请备注:从官网了解到