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鼠标滑过展示图片时显示详情的更多相关文章

  1. jQuery实现的鼠标滑过切换图片代码实例

    jQuery实现的鼠标滑过切换图片代码实例:有时候网页需要这样的简单效果,那就是当鼠标滑过默认图片的时候,能够实现图片的切换,可能在实际应用中,往往没有这么简单,不过大家可以自行扩展一下,下面简单介绍 ...

  2. CSS控制当鼠标滑过时更换图片的效果

    鼠标滑过时更换图片的效果有很多方法可以实现,在本文将为大家介绍喜爱如何通过css来实现.<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Tra ...

  3. jquery鼠标滑过提示title具体实现代码

    jquery鼠标滑过提示title的实现代码. 如下: <script type="text/javascript" src="http://ajax.google ...

  4. jQuery鼠标滑过横向时间轴效果

    jQuery鼠标滑过横向时间轴效果---效果图: jQuery鼠标滑过横向时间轴效果---全部代码: <!DOCTYPE html> <html> <head> & ...

  5. 通过使用CSS字体阴影效果解决hover图片时显示文字看不清的问题

    1.前言 最近需要加入一个小功能,在鼠标越过图片时,提示其大小和分辨率,而不想用增加属性title来提醒,不够好看.然而发现如果文字是一种颜色,然后总有概率碰到那张图上浮一层的文字会看不到,所以加入文 ...

  6. jquery mobile 请求数据方法执行时显示加载中提示框

    在jquery mobile开发中,经常需要调用ajax方法,异步获取数据,如果异步获取数据方法由于网速等等的原因,会有一个反应时间,如果能在点击按钮后数据处理期间,给一个正在加载的提示,客户体验会更 ...

  7. 鼠标滑过元素,div显示,并根据scrollTop向下移动

    如上图所示,通道有很多个,表格只有一个. 注意:滑过通道时鼠标如果停留在上面,那么表格才显示,鼠标滑过表格时,表格不消失 <div id="lineContent"> ...

  8. web页面上展示图片时,图片不显示,报错:ERR_CONTENT_LENGTH_MISMATCH

      问题描述 前端页面加载css,和js文件的时候,经常出现ERR_CONTENT_LENGTH_MISMATCH的报错情况.   查找问题 在单独打开hearder中css,js的网络地址是能打开的 ...

  9. C# chart,有关如何在鼠标移动到Series上时显示节点及数据 (有待继续更新)

    一.效果与思路 效果: 解决方案1 用chart的mousemove时间,实时跟踪鼠标最近的X轴的位置,然后把cursorX设置到那个位置上,让用户知道我是选的那一个X的值,同时用tooltip显示该 ...

随机推荐

  1. UVA 1622 Robot

    题意: 给出n*m个格子,每个格子里有一个机器人,可以执行东南西北四种指令,但是移动出格就会爆炸.给出四种指令的个数,求最多完成多少次指令. 分析: 首先对输入数据进行处理,使得cw≥ce.cn≥cs ...

  2. JDK8环境变量配置相关问题

    1.右键选择 计算机→属性→高级系统设置→高级→环境变量 2.系统变量→新建 变量名:JAVA_HOME 变量值:(变量值填写你的jdk的安装目录,例如本人是 E:Javajdk1.7.0) 3.在系 ...

  3. 记一次phpStudy apache启动后自动关闭 修改过程

    第一种可能原因:路径包含中文 .添加站点 2.重启服务 3.遇见问题 apache 刚启动,1秒钟中后就停止 4.解决问题 发现是自己添加的网站中包含中文路径的问题,建议不要在自己的网站目录下包含中文 ...

  4. Android 模块化编程之引用本地的aar

    转: http://www.stormzhang.com/android/2015/03/01/android-reference-local-aar/ 随着项目越来越多,代码的复用就变得异常重要,这 ...

  5. return 和 echo 的小坑

    在写项目的时候,有好几次遇到过同样的问题,控制器里面返回的json在前台无显示,利用console.log()总是显示这样的现象 数据库操作成功,却没有返回值. 原因是在控制器返回的使用使用了 ret ...

  6. Python学习笔记(二)Python的数据类型和变量

    Python的字符串 Python使用''和""将字符串括起来,与ruby类似,特殊之处是Python可以使用r''表示''内部的字符串默认不转义,如: print(r'\\\t\ ...

  7. DenyHosts 安装及配置详解

    DenyHosts是Python语言写的一个程序,它会分析sshd的日志文件(/var/log/secure),当发现重 复的攻击时就会记录IP到/etc/hosts.deny文件,从而达到自动屏IP ...

  8. 【自学php】第三天 - 读写文件

    这次的例子是把订单的数据保存起来,一般是用数据库来进行数据的存储最好,但是今天目的是为了学习读写文件,所以这次把数据存在文件里. 读写文件有一般有三个步骤: 1)打开文件.如果文件不存在,需要先创建它 ...

  9. 论山寨手机与Android联姻 【2】手机OS成为核心

    手机凭借通话和短信这两项基本功能,积累了用户,开拓了市场.但是用户的需求是永无止境的,对于手机制造商来说,紧跟用户需求,拓展手机功能,是机会也是挑战. 1988年第一款数码相机,在日本上市.数码相机的 ...

  10. Android studio 安装,JDK 出错解决方案

    在安装android studio 的时候,会报一个错误: --------------------------- Error launching Android Studio ----------- ...