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. 彻底解决TAP(点透)提升移动端点击响应速度

    使用fastclick 尼玛使用太简单了,直接一句: FastClick.attach(document.body); 于是所有的click响应速度直接提升,刚刚的!什么input获取焦点的问题也解决 ...

  2. Intent组件

    Android页面之间的跳转可以分为几类,比如有A和B两个页面,从A页面直接跳转到B页面,这样的跳转比较简单,或者从A页面跳转到B页面但是需要传送数据.在Android中,页面的跳转离不开Intent ...

  3. IIS出现Server Application Unavailable的解决办法

    在XP中IIS5.1服务器,运行asp.net出现Server Application Unavailable,经过多次查证,才发现是因为先安装了.net Framework 2.0然后安装IIS,导 ...

  4. 学习ios设计（1）

    两年前,苹果为现代的使用者完全改变了设计语言.对于设计者来说,这使得他们更容易关注动画和功能而不是其他的细枝末节. 我已经被问过很多次怎样开始设计或者是有什么捷径可以成为更好的设计师.虽然没有银弹,然 ...

  5. GitBook是一个命令行工具（Node.js库），我们可以借用该工具使用Github/Git和Markdown来制作精美的图书，但它并不是一本关于Git的教程哟。

    GitBook是一个命令行工具(Node.js库),我们可以借用该工具使用Github/Git和Markdown来制作精美的图书,但它并不是一本关于Git的教程哟. 支持输出多种格式 GitBook支 ...

  6. mysql学习（七）-索引学习

    常规索引: 在常用查询的字段上使用常规索引 创建表时一块创建索引 create table if not exists carshop(id int not null auto_increment, ...

  7. Manifest merger failed : uses-sdk:minSdkVersion 9 cannot be smaller than version 10 declared in library

    Error:Execution failed for task ':app:processDebugManifest'. > Manifest merger failed : uses-sdk: ...

  8. Linux定时任务Crontab命令详解

    linux 系统则是由 cron (crond) 这个系统服务来控制的.Linux 系统上面原本就有非常多的计划性工作,因此这个系统服务是默认启动的.另 外, 由于使用者自己也可以设置计划任务,所以, ...

  9. 把WCF服务部署服务器IIS异常（详细：处理程序“svc-Integrated”在其模块列表中有一个错误模块“ManagedPipelineHandler”）

    详细:处理程序“svc-Integrated”在其模块列表中有一个错误模块“ManagedPipelineHandler” 原因: vs2010默认的是4.0框架,4.0的框架是独立的CLR,和2.0 ...

  10. CSS自学笔记（8）:CSS拓展（一）

    CSS元素对齐 可以使用margin属性类进行元素的水平对齐 水平对齐块元素时,可以将块元素的margin属性定义为"auto",这里需要注意的是,应该要声明!DOCTYPE,否则 ...