`
zhangyaochun
  • 浏览: 2608963 次
  • 性别: Icon_minigender_1
  • 来自: 北京
文章分类
社区版块
存档分类
最新评论

关于图片滚动放大

阅读更多

前面写过一篇关于滚轴的兼容,有兴趣移步这里:http://zhangyaochun.iteye.com/blog/1187536

 

本文不是谈这个,而是在万网上的一个小小应用:

 

先上代码:

 

<img onmousewheel = "return bbimg(this)" onload="javascript:resizepic(this)" />

 

function bbimg(o){
      var zoom = parseInt(o.style.zoom,10) || 100;

      zoom += event.wheelDetla / 12;

      if(zoom > 0){
            o.style.zoom = zoom + '%';
      }  

       return false;
}

 

function resizepic(thispic){
      if(thispic.width > 700){
           thispic.width = 700;
      }
}

 

分享到:
评论

相关推荐

    js特性 图片滚动 放大

    在"js特性 图片滚动 放大"这个主题中,我们将深入探讨如何利用JavaScript实现图片滚动时的交互功能,以及点击图片后自动停止滚动并放大图片的效果。 首先,我们需要理解JavaScript的基本特性。它是一种解释型语言,...

    jquery图片滚动放大效果.zip

    《jQuery实现图片滚动放大效果详解》 在网页设计中,动态的、引人注目的视觉效果往往能够提升用户体验,使网站更加生动有趣。"jQuery图片滚动放大效果"就是一种常用的增强用户互动性的技术,它利用JavaScript库...

    jquery图片放大滚动

    "jQuery图片放大滚动"是一种常用的增强用户互动性的技术,它结合了图片切换、图片滚动以及图片放大功能,使浏览过程更加生动有趣。本篇文章将详细介绍这一技术的核心概念、实现方法和应用场景。 **1. jQuery库的...

    图片滚动中间放大效果

    "图片滚动中间放大效果"是一种常见的网页设计技巧,它通常应用于产品展示、图片滑块或轮播图组件中。这种效果使得图片在滚动过程中,当图片位于视口中央时自动放大,从而突出显示当前主要内容,为用户带来更生动的...

    带图片滚动的Flash产品图片展示放大显示.rar

    带图片滚动的Flash产品图片展示放大显示,非常动感的Flash图片展示效果,可用于产品图片的放大、滚动展示等。点击后下侧显示详细的产品,任意点击一个图片,左侧和右下侧会显示出该产品的大图片以及描述信息。

    图片点击放大+滚动放大+图片旋转.zip

    总结起来,这个压缩包提供了图片交互功能的完整解决方案,包括点击放大、滚动放大和旋转,特别强调了对IE浏览器的兼容性。开发者可以通过学习和使用这些代码,提升网站或应用中图片展示的用户体验。同时,这也反映了...

    ios-图片滚动放大缩小.zip

    在iOS开发中,实现“图片滚动放大缩小”的功能通常涉及到UIScrollView和UIImageView的使用。这个功能在许多应用中都很常见,比如相册应用或者图片浏览应用,用户可以通过手势对图片进行平移、缩放等操作。以下是一些...

    ZoomMarker一款用于图片滚动放大拖动且可以添加标记的jQuery插件不错的插件

    - **zoomStep**:每次滚动时图片放大的比例。 - **markerColor**:标记的颜色。 - **markerSize**:标记的大小。 - **draggable**:是否允许用户拖动放大后的图片。 - 更多参数可以通过阅读ZoomMarker的官方...

    带箭头的图片滚动特效,点击放大特效.

    总结,实现"带箭头的图片滚动特效,点击放大特效"需要结合CSS3动画、JavaScript/jQuery交互以及合理的图片管理和显示策略。通过这样的设计,不仅可以提升网站的视觉吸引力,还能提供更友好的用户体验。在实际项目中...

    图片 滚动 放大缩小 旋转

    在IT领域,图片的滚动、放大缩小和旋转是常见的图像处理功能,特别是在网页设计和图形用户界面(GUI)开发中。这两个压缩包文件——`iviewer-master.rar`和`mousewheel.zip`,可能包含了实现这些功能的源代码或者库...

    JQuery插件图片滚动带放大镜

    **jQuery插件图片滚动带放大镜详解** 在网页设计中,为了提高用户体验,尤其是在商品展示环节,图片的处理显得尤为重要。"JQuery插件图片滚动带放大镜"就是一种常用的解决方案,它能模拟天猫、淘宝等电商平台的商品...

    JS滚动放大镜

    总结来说,JS滚动放大镜是一个提升用户体验的前端技术,它利用JavaScript和CSS实现动态的图片放大和滚动,兼容多种浏览器,使用户能便捷地查看商品详情。理解和掌握这种技术,对于前端开发者来说,是提升网站互动性...

    图片滚动效果,鼠标移至上面图片放大并跟随移动

    在网页设计中,"图片滚动效果,鼠标移至上面图片放大并跟随移动"是一种常见的交互设计,它能够提升用户体验,使网站更具吸引力。这种效果通常应用于产品展示、相册浏览等场景,让用户能够更直观地查看图片细节。下面...

    jquery实现图片滚动并放大效果.rar

    jquery实现图片滚动并放大效果.rarjquery实现图片滚动并放大效果.rarjquery实现图片滚动并放大效果.rarjquery实现图片滚动并放大效果.rarjquery实现图片滚动并放大效果.rarjquery实现图片滚动并放大效果.rar

    图片滚动 图片切换 图片点击放大

    在网页设计和开发中,实现图片滚动、切换和点击放大的功能是一项常见的需求,尤其适用于产品展示、相册浏览等场景。以下将详细介绍这个功能的关键知识点,并提供可能的实现方式。 1. **图片滚动**: 图片滚动通常...

    防Discuz点击图片放大、可拖动、随鼠标滚动放大缩小

    综上所述,实现“防Discuz点击图片放大、可拖动、随鼠标滚动放大缩小”需要综合运用HTML、CSS和JavaScript,涉及事件监听、坐标计算、动画效果等多个方面。开发者需要具备扎实的前端开发技能,同时关注用户体验和...

    图片滚动 放大当前图片 jquery插件版.rar

    jquery插件版图片滚动 放大当前图片,当点击左右的控制按钮,图片一整行滚动,当前滚动的图片,会放大显示。在整个图片滚动框的上部,会显示出整体的图片滚动进度,红色标记对应的位置,告诉浏览者当前图片在整个...

    js点击图片放大缩小水平滚动条拖动图片滚动展示

    在JavaScript(JS)编程中,实现图片的点击放大缩小以及水平滚动条拖动来滚动展示图片的功能是一项常见的需求。这个功能通常应用于网页上的图像查看器或者产品细节展示,让用户能够更方便地查看图像的各个部分。以下...

    jquery实现图片滚动并放大效果

    本项目“jquery实现图片滚动并放大效果”是利用 jQuery 创建一个互动性的图片展示功能,该功能包括点击图片左右按钮进行图片切换以及鼠标悬停时图片自动放大的视觉效果。下面我们将详细探讨实现这些效果的关键技术和...

Global site tag (gtag.js) - Google Analytics