jquery鼠标滑过展示图片时显示详情
生活随笔
收集整理的這篇文章主要介紹了
jquery鼠标滑过展示图片时显示详情
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
jquery:
1 <script src="js/jquery.js" type="text/javascript"></script> 2 <script type="text/javascript"> 3 $(document).ready(function(){ //頁面邊加載邊執行 4 $('.box').hover( 5 function(){ 6 $(this).find('img').animate({width:100, height:100,marginTop:10,marginLeft:10},600); 7 8 }, 9 function(){ 10 $(this).find('img').animate({width:600, height:330,marginTop:0,marginLeft:0},180); 11 }); 13 }); 14 </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> ?
轉載于:https://www.cnblogs.com/aure/p/4336157.html
總結
以上是生活随笔為你收集整理的jquery鼠标滑过展示图片时显示详情的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: [转]手游研发数据专业术语科普 游戏热度
- 下一篇: Android 混淆文件project.