• linkedu视频
  • 平面设计
  • 电脑入门
  • 操作系统
  • 办公应用
  • 电脑硬件
  • 动画设计
  • 3D设计
  • 网页设计
  • CAD设计
  • 影音处理
  • 数据库
  • 程序设计
  • 认证考试
  • 信息管理
  • 信息安全
菜单
linkedu.com
  • 网页制作
  • 数据库
  • 程序设计
  • 操作系统
  • CMS教程
  • 游戏攻略
  • 脚本语言
  • 平面设计
  • 软件教程
  • 网络安全
  • 电脑知识
  • 服务器
  • 视频教程
  • JavaScript
  • ASP.NET
  • PHP
  • 正则表达式
  • AJAX
  • JSP
  • ASP
  • Flex
  • XML
  • 编程技巧
  • Android
  • swift
  • C#教程
  • vb
  • vb.net
  • C语言
  • Java
  • Delphi
  • 易语言
  • vc/mfc
  • 嵌入式开发
  • 游戏开发
  • ios
  • 编程问答
  • 汇编语言
  • 微信小程序
  • 数据结构
  • OpenGL
  • 架构设计
  • qt
  • 微信公众号
您的位置:首页 > 程序设计 >jquery > jQuery鼠标经过方形图片切换成圆边效果代码分享

jQuery鼠标经过方形图片切换成圆边效果代码分享

作者: 字体:[增加 减小] 来源:互联网

通过本文主要向大家介绍了jQuery切换特效,jQuery页面切换特效,jQuery图片切换特效等相关知识,希望对您有所帮助,也希望大家支持linkedu.com www.linkedu.com

这是一款基于jQuery鼠标经过方形图片切换成圆边特效代码,点击图片会弹出浮层,用户还可以自定义对应图片的标题与文字说明,适合图片页面的展示,是一款非常实用的图片特效源码。

运行效果图: --------------------------------效果演示 源码下载----------------------------------

鼠标经过方形图片切换成圆边效果

点击图片会弹出浮层

为大家分享的jQuery鼠标经过方形图片切换成圆边效果代码如下

<head>

<title>jQuery鼠标经过方形图片切换成圆边特效</title>
<link href="css/lrtk.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="js/jquery-1.7.1.js"></script>
<style type="text/css">
<!--
.STYLE1 {
 font-size: x-large;
 font-weight: bold;
}
-->
</style>
</head>
<body>
<!-- 代码 开始 -->
<div id="teamcont" >
 <div style="width:780px;margin:10px auto; text-align:center">
 <div class="parinforma cssshadow">
 <div class="closebtn"></div>
 <div class="showLeft">
 <div class="partener">
 <img class="row1" src="img/partner/balidao.jpg" >
 <div class="pname">展示</div>
 <div class="pinfo">巴厘岛</div>
 </div>
 </div>
<div class="showRight">
 <div class="huncontent">
 巴厘岛(Bali Island),是世界著名的旅游岛,行政上称为巴厘省,是印度尼西亚33个一级行政区之一。
巴厘岛上大部分为山地,全岛山脉纵横,地势东高西低。岛上的最高峰是阿贡火山(巴厘峰)海拔3142米。巴厘岛是印度尼西亚唯一信奉印度教的地区。80%的人信奉印度教。主要通行的语言是印尼语和英语。
沙努尔、努沙-杜尔和库达等处的海滩,是岛上景色最美的海滨浴场,这里沙细滩阔、海水湛蓝清澈。每年来此游览的各国游客络绎不绝。 由于巴厘岛万种风情,景物甚为绮丽。因此,它还享有多种别称,如“神明之岛”、“恶魔之岛”、“罗曼斯岛”、“绮丽之岛”、“天堂之岛”、“魔幻之岛”、“花之岛”等。   </div>
 </div>
  <div style="clear:both"></div>
 </div>
  <div class="parinforma cssshadow">
 <div class="closebtn"></div>
 <div class="showLeft">
 <div class="partener">
 <img class="row1" src="img/partner/maerdaifu.jpg" >
 <div class="pname">展示</div>
 <div class="pinfo">双鱼岛</div>
 </div>
 </div>
 <div class="showRight">
 <div class="huncontent"> 
 双鱼岛设施现代舒适。沿着从岛上延伸至码头的长长栈道,不时有鲨鱼及其它不小的鱼在附近巡游。到了码头,沙地一侧沿岸尽是数以万计的小鱼,密密麻麻结成一团,周围有小鲨鱼或其它掠食鱼类出没。
至于码头另一侧则是延伸成峭壁的礁岩地形,每块礁岩周围都有蝶鱼、雀鲷等珊瑚礁鱼类出没,码头正下方也有成群的底栖性鱼类,沿着峭壁的边界,回游性的大物不时出没,牛港参、海龟均有所见。就赏鱼角度而言,双鱼岛单单是码头边就已精彩万分。岛上的日本客人很多,他们主要是来潜水的。 </div>
 </div>
 <div style="clear:both"></div>
 </div>
 
 <div class="parinforma cssshadow">
 <div class="closebtn"></div>
 <div class="showLeft">
 <div class="partener">
 <img class="row1" src="img/partner/xianggang.jpg" >
 <div class="pname">展示</div>
 <div class="pinfo">香港</div>
 </div>
 </div>
 <div class="showRight">
 <div class="huncontent"> 
 香港(Hong Kong),全称中华人民共和国香港特别行政区(Hong Kong Special Administrative Region of the People's Republic of China,简写:HKSAR)。由香港岛、九龙半岛、新界(包括大屿山及230余个大小岛屿)组成。地处中国华南,珠江口东侧,北隔深圳河与广东深圳相接;西与澳门隔海相望;南临南中国海。
香港是一座高度繁荣的国际大都市,是仅次于纽约和伦敦的全球第三大金融中心,与美国纽约、英国伦敦并称“纽伦港”。香港是亚洲重要的金融、服务和航运中心,以廉洁的政府、良好的治安、自由的经济体系以及完善的法制闻名于世,有“东方之珠”、“美食天堂”和“购物天堂”等美誉。 </div>
 </div>
 <div style="clear:both"></div>
 </div>
 
 <div class="parinforma cssshadow">
 <div class="closebtn"></div>
 <div class="showLeft">
 <div class="partener">
 <img class="row1" src="img/partner/zhangjiajie.jpg" >
 <div class="pname">展示</div>
 <div class="pinfo">张家界</div>
 </div>
 </div>
 <div class="showRight">
 <div class="huncontent"> 
 张家界是湖南省辖地级市,原名大庸市,辖2个市辖区(永定区、武陵源区)、2个县(慈利县、桑植县)。位于湖南西北部,澧水中上游,属武陵山区腹地。张家界因旅游建市,是中国最重要的旅游城市之一,是湘鄂西、湘鄂川黔革命根据地的发源地和中心区域。
1982年9月,张家界国家森林公园成为中国第一个国家森林公园。
1988年8月,武陵源风景名胜区列入第二批国家重点风景名胜区;1992年,由张家界国家森林公园等三大景区构成的武陵源自然风景区被联合国教科文组织列入《世界自然遗产名录》;2004年2月,被列为中国首批《世界地质公园》;2007年,被列入中国首批5A级景区。 </div>
 </div>
 <div style="clear:both"></div>
 </div>
 
 <div class="parinforma cssshadow">
 <div class="closebtn"></div>
 <div class="showLeft">
 <div class="partener">
 <img class="row1" src="img/partner/xianggelila.jpg" >
 <div class="pname">展示</div>
 <div class="pinfo">香格里拉</div>
 </div>
 </div>
 <div class="showRight">
 <div class="huncontent"> 
 香格里拉市是迪庆藏族自治州下辖市之一,市境位于云南省西北部,是滇、川及西藏三省区交汇处,也是“三江并流”风景区腹地。截止到2014年,香格里拉市总面积11613平方公里,辖4个镇、7个乡,共有6个社区、58个行政村。
2011年,香格里拉市年末总人口为17.45万人,除主体民族藏族外还有汉族、纳西族、彝族、白族等十几个民族,人口密度为10人/平方公里,是云南省面积最大、人口密度最低的市份之一。2011年,香格里拉实现县级生产总值359580万元,市级一、二、三产业增加值占全县生总产值的比重为9.4:38.3:52.3。香格里拉县主要旅游景点有哈巴雪山,普达措,梅里雪山等景点。 </div>
 </div>
 <div style="clear:both"></div>
 </div>
 
 <div class="parinforma cssshadow">
 <div class="closebtn"></div>
 <div class="showLeft">
 <div class="partener">
 <img class="row1" src="img/partner/qingdao.jpg" >
 <div class="pname">展示</div>
 <div class="pinfo">青岛</div>
 </div>
 </div>
 <div class="showRight">
 
 <div class="huncontent"> 
 青岛,别称“岛城”、“琴岛”、旧称“胶澳”,地处山东半岛东南部沿海,胶东半岛东部,东、南濒临黄海,隔海与朝鲜半岛相望。拥有一个国家级新区(青岛西海岸新区)。
青岛是全国文明城市、中国最具幸福感城市、国家历史文化名城、国家园林城市;是国家海洋科研及海洋产业开发中心城市,国家重要的现代化制造业及高新技术产业基地;是东北亚国际航运中心、国际港口、国家重要的区域性航空港,同时也是中国14个沿海开放城市、15个区域经济中心城市之一。 </div>
 </div>
 <div style="clear:both"></div>
 </div>
 
 <div class="parinforma cssshadow">
 <div class="closebtn"></div>
 <div class="showLeft">
 <div class="partener">
 <img class="row1" src="img/partner/xiong.jpg" >
 <div class="pname">展示</div>
 <div class="pinfo">上海</div>
 </div>
 </div>
 <div class="showRight">
 




 
分享到:QQ空间新浪微博腾讯微博微信百度贴吧QQ好友复制网址打印

您可能想查找下面的文章:

  • jquery图片倾斜层叠切换特效代码分享
  • jQuery鼠标经过方形图片切换成圆边效果代码分享

相关文章

  • jquery 简短右键菜单 多浏览器兼容
  • js jquery获取随机生成id的服务器控件的三种方法
  • jquery HotKeys轻松搞定键盘事件代码
  • 用Jquery实现多级下拉框无刷新的联动
  • Visual Studio中的jQuery智能提示设置方法
  • jQuery.autocomplete 支持中文输入(firefox)修正方法
  • jQuery复合事件用法示例
  • 一个基于jquery的文本框记数器
  • 网站如何做到完全不需要jQuery也可以满足简单需求
  • jQuery登陆判断简单实现代码

文章分类

  • JavaScript
  • ASP.NET
  • PHP
  • 正则表达式
  • AJAX
  • JSP
  • ASP
  • Flex
  • XML
  • 编程技巧
  • Android
  • swift
  • C#教程
  • vb
  • vb.net
  • C语言
  • Java
  • Delphi
  • 易语言
  • vc/mfc
  • 嵌入式开发
  • 游戏开发
  • ios
  • 编程问答
  • 汇编语言
  • 微信小程序
  • 数据结构
  • OpenGL
  • 架构设计
  • qt
  • 微信公众号

最近更新的内容

    • jquery实现搜索框常见效果的方法
    • 使用jquery.form.js实现图片上传的方法
    • Jquery下判断Id是否存在的代码
    • jQuery插件Timelinr 实现时间轴特效
    • JQuery入门——事件切换之toggle()方法应用介绍
    • hovertree插件实现二级树形菜单(简单实用)
    • 20款超赞的jQuery插件 Web开发人员必备
    • jQuery获取Radio,CheckBox选择的Value值(示例代码)
    • jQuery包裹节点用法完整示例
    • jQuery实现渐变弹出层和弹出菜单的方法

关于我们 - 联系我们 - 免责声明 - 网站地图

©2020-2025 All Rights Reserved. linkedu.com 版权所有