jquery鼠标滑过展示图片时显示详情
jquery:
<script src="js/jquery.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function(){ //页面边加载边执行
$('.box').hover(
function(){
$(this).find('img').animate({width:100, height:100,marginTop:10,marginLeft:10},600); },
function(){
$(this).find('img').animate({width:600, height:330,marginTop:0,marginLeft:0},180);
});
});
</script>
<body>
<div class="main">
<div class="box">
<img src="img/0.jpg"/>
<div class="info">
<h1>div+css及js结合的布局</h1>
Bootstrap,来自 Twitter,是目前最受欢迎的前端框架。Bootstrap 是基于 HTML、CSS、JAVASCRIPT 的,它简洁灵活,使得 Web 开发更加快捷。所以要求学好HTML、CSS、JAVASCRIPT 。
</div>
</div>
</div>
jquery鼠标滑过展示图片时显示详情的更多相关文章
- jQuery实现的鼠标滑过切换图片代码实例
jQuery实现的鼠标滑过切换图片代码实例:有时候网页需要这样的简单效果,那就是当鼠标滑过默认图片的时候,能够实现图片的切换,可能在实际应用中,往往没有这么简单,不过大家可以自行扩展一下,下面简单介绍 ...
- CSS控制当鼠标滑过时更换图片的效果
鼠标滑过时更换图片的效果有很多方法可以实现,在本文将为大家介绍喜爱如何通过css来实现.<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Tra ...
- jquery鼠标滑过提示title具体实现代码
jquery鼠标滑过提示title的实现代码. 如下: <script type="text/javascript" src="http://ajax.google ...
- jQuery鼠标滑过横向时间轴效果
jQuery鼠标滑过横向时间轴效果---效果图: jQuery鼠标滑过横向时间轴效果---全部代码: <!DOCTYPE html> <html> <head> & ...
- 通过使用CSS字体阴影效果解决hover图片时显示文字看不清的问题
1.前言 最近需要加入一个小功能,在鼠标越过图片时,提示其大小和分辨率,而不想用增加属性title来提醒,不够好看.然而发现如果文字是一种颜色,然后总有概率碰到那张图上浮一层的文字会看不到,所以加入文 ...
- jquery mobile 请求数据方法执行时显示加载中提示框
在jquery mobile开发中,经常需要调用ajax方法,异步获取数据,如果异步获取数据方法由于网速等等的原因,会有一个反应时间,如果能在点击按钮后数据处理期间,给一个正在加载的提示,客户体验会更 ...
- 鼠标滑过元素,div显示,并根据scrollTop向下移动
如上图所示,通道有很多个,表格只有一个. 注意:滑过通道时鼠标如果停留在上面,那么表格才显示,鼠标滑过表格时,表格不消失 <div id="lineContent"> ...
- web页面上展示图片时,图片不显示,报错:ERR_CONTENT_LENGTH_MISMATCH
问题描述 前端页面加载css,和js文件的时候,经常出现ERR_CONTENT_LENGTH_MISMATCH的报错情况. 查找问题 在单独打开hearder中css,js的网络地址是能打开的 ...
- C# chart,有关如何在鼠标移动到Series上时显示节点及数据 (有待继续更新)
一.效果与思路 效果: 解决方案1 用chart的mousemove时间,实时跟踪鼠标最近的X轴的位置,然后把cursorX设置到那个位置上,让用户知道我是选的那一个X的值,同时用tooltip显示该 ...
随机推荐
- PHP定义数组常量
最先想到的方法是这样: define('SIGN_CODE', array('9df512','59gf1g','5eg7h1','g1agf5','f5e151','g51gfr','a5481s' ...
- Jquery二级简单折叠菜单
写在前面: 1.前端新手 2.欢迎交流 3. 源代码百度云页面示例链接: http://pan.baidu.com/s/1nt0yjd3 链接失效请留言 效果图: 代码部分:jquery部分: < ...
- 用ul、li做横向导航
/* ul li以横排显示 */ /* 所有class为menu的div中的ul样式 */ div.menu ul { list-style:none; /* 去掉ul前面的符号 */ margin: ...
- eclipse 使用maven 创建springmvc + mybatis
接着eclipse 使用maven 创建纯spring mvc项目 毕竟项目都要访问数据库的, 所以加上mybatis的支持也就是网上大多时候说的 SSM框架的搭建(Spring + Spring M ...
- ConnectivityManager与检查网络连接的使用
1.ConnectivityManager的作用 ConnectivityManager主要管理和网络管理相关的操作 TelephonyManager则管理和手机.运营商等的相关信息 WifiMana ...
- 关于Android新建出错:Errors occurred during the build. Errors running builder 'Android Resource M
新建一个eclipse的工作空间就可以了. fuck~
- MySQLdb-python的安装
第一步下载: 第一步:进入https://github.com/farcepest/MySQLdb1/ 第二步:解压 Shell>unzip /root/MySQLdb1-MySQLdb-1.3 ...
- RMSE、RMS、标准差
1.均方根误差,它是观测值与真值偏差的平方和观测次数n比值的平方根,在实际测量中,观测次数n总是有限的,真值只能用最可信赖(最佳)值来代替.方根误差对一组测量中的特大或特小误差反映非常敏感,所以,均方 ...
- 三篇编译libcurl,附下载 good
http://download.csdn.net/detail/flyliying/2982867 http://download.csdn.net/detail/wojiushiwo987/9113 ...
- 加入商品分类信息,考虑用户所处阶段的 图模型 推荐算法 Rws(random walk with stage)
场景: 一个新妈妈给刚出生的宝宝买用品,随着宝宝的长大,不同的阶段需要不同的物品. 这个场景中涉及到考虑用户所处阶段,给用户推荐物品的问题. 如果使用用户协同过滤,则需要根据购买记录,找到与用户处于同 ...