`
不要骗我
  • 浏览: 16084 次
  • 性别: Icon_minigender_1
  • 来自: 成都
文章分类
社区版块
存档分类
最新评论

鼠标移动--图片放大

阅读更多
2011-05-23 01:07

<html>
 <head>
 </head>
 
 <body>
  <div align="center">
   <img src="2.jpg" width="200px" height=250px" id="image" onmouseover="showPicture()" onmouseout="showPicture1()">
  </div>
  <script type="text/javascript">
    function showPicture(){
    document.getElementById("image").style.width="532px";
    document.getElementById("image").style.height="608px";
   }
   function showPicture1(){
    document.getElementById("image").style.width="200px";
    document.getElementById("image").style.height="250px";
   }
  </script>
  <script type="text/javascript">
//   document.getElementById("image").attachEvent("onmouseover",showPicture);
//   document.getElementById("image").attachEvent("onmouseout",showPicture1);
  </script>
 </body>
</html>

 

分享到:
评论

相关推荐

    jquery鼠标移动放大图片

    "jQuery鼠标移动放大图片"是一种常见的交互效果,它允许用户在鼠标悬停于图片上时,看到一个放大的图片视图。本文将深入探讨如何使用jQuery库来实现这一功能。 首先,jQuery是一个广泛使用的JavaScript库,它简化了...

    网页特效-图片特效-鼠标悬停图片放大效果

    ### 网页特效-图片特效-鼠标悬停图片放大效果 #### 一、概述 在现代网页设计中,为了提升用户体验与交互性,设计师们常常会加入各种动态效果,其中“鼠标悬停图片放大”是一项非常实用且常见的功能。通过CSS与HTML...

    javaFX 图片放大缩小移动

    我们可以通过监听鼠标的拖动事件,记录开始拖动时的鼠标位置,然后在鼠标移动时更新图片的位置,使其跟随鼠标移动。 项目中的`JavaFXApplication1`很可能是一个包含主类的NetBeans工程,这个主类继承自`Application...

    JavaScript鼠标移动放大图片特效

    "JavaScript鼠标移动放大图片特效"是一种常见的网页交互功能,它允许用户在鼠标悬停在图片上时看到图片的放大效果,提升了浏览者的视觉体验。 实现这一特效主要涉及以下几个技术点: 1. **事件监听**:首先,我们...

    Qt QGraphicsView实现图片放缩、鼠标拖动移动、鼠标点位置放大缩小-图片查看.rar

    Qt QGraphicsView实现图片放缩、鼠标拖动移动、鼠标点位置放大缩小_图片查看.rar 文件大小: 1718087 字节 修改时间: 2024年9月2日, 14:32:55 MD5: DC77C0D16EAF92D9F53957DE19E4BD2C SHA1: 91BF2FF1F7333C1C9F6B69EC...

    jquery图片放大镜效果鼠标移到图片放大CloudZoom

    CloudZoom的工作原理是创建一个与原图大小相同的隐藏层,当鼠标移动到图片上时,这个隐藏层会显示出来,并根据鼠标的移动动态改变放大区域,展示出高分辨率的细节部分。 实现CloudZoom的基本步骤如下: 1. **引入...

    jquery实现鼠标移动到方格图片上图片放大功能

    "jQuery 实现鼠标移动到方格图片上图片放大功能"是一种常见的交互效果,它可以让用户在浏览一组方格排列的图片时,只需将鼠标悬停在某张图片上,该图片就能自动放大并全屏展示,提供更清晰的细节查看。这种效果可以...

    CSS3实现的鼠标移动到图片上不规则放大

    本案例主要探讨的是如何通过CSS3实现一种独特的交互效果——当鼠标移动到图片上时,图片会呈现波浪式不规则放大。这个效果可以吸引用户的注意力,增加页面的互动性和趣味性。以下是关于这一技术的详细解释。 首先,...

    鼠标点击图片、图片放大

    在IT领域,尤其是在网页设计和用户体验(UX)设计中,"鼠标点击图片、图片放大"是一种常见的交互功能,它能够提升用户的浏览体验。这个功能允许用户通过点击图片来查看更详细的图像信息,通常用于产品展示、摄影网站...

    java实现图片中心放大、缩小、移动、鼠标拖移

    当鼠标按下时记录当前坐标,然后在鼠标移动时计算差值并应用到图片位置。 ```java label.addMouseListener(new MouseAdapter() { private Point dragStart; @Override public void mousePressed(MouseEvent e...

    Unity鼠标滑过,图片局部放大效果

    - 考虑性能影响,避免在鼠标移动过程中频繁地改变图片的Scale,可以使用缓动函数(Ease Functions)优化动画性能。 通过以上步骤,我们就能在Unity中实现“鼠标滑过,图片局部放大”的效果。这个过程涉及到Unity的...

    鼠标移动图片局部放大

    在计算机图形学和用户界面设计中,"鼠标移动图片局部放大"是一种常见且实用的功能,它增强了用户对图像细节的观察能力。这个功能通常应用于各种应用程序,如图像查看器、地图应用、设计软件等,使得用户可以更清晰地...

    纯js随鼠标位置变化移动速度图片放大缩小展示特

    同时,可能还会用到`translate()`函数来改变元素的位置,以实现随着鼠标移动而改变图片位置的效果。 4. **响应式设计**:考虑到不同设备的屏幕尺寸,特效可能需要适应各种视口大小。开发者可能会使用百分比单位或者...

    QT:QGraphicsView实现图片放缩、鼠标拖动移动和鼠标点击位置放大缩小

    visual studio环境下的QT实现图片放缩、鼠标拖动移动和鼠标点击位置放大缩小的项目工程文件

    VB放大镜,放大鼠标移动区域

    标题中的“VB放大镜,放大鼠标移动区域”指的是一个基于Visual Basic(VB)编程语言的程序,该程序具有实时放大屏幕指定区域的功能。当用户将鼠标移动到屏幕上时,程序会跟随鼠标的移动,对鼠标所在位置的周围区域...

    jquery鼠标悬浮图片放大效果

    // 鼠标移动时更新放大图片的位置 $this.parent().mousemove(function(e) { var offsetX = e.pageX - $this.offset().left; var offsetY = e.pageY - $this.offset().top; var ratioX = offsetX / $this.width...

    鼠标经过图片放大图片-js脚本特效.rar

    例如,`addEventListener` 方法用于监听鼠标移动事件,`mousemove` 是这个事件的类型。在事件处理函数内部,我们需要获取鼠标的当前位置,可以通过 `event.clientX` 和 `event.clientY` 来获取。接着,根据这些坐标...

    用flash制作图片放大效果鼠标滑过图片放大flash源文件

    鼠标滑过图片放大flash源文件,直接替换图片就可以做自己的图片放大flash动画

    jquery-点击放大图片

    5. **实时更新放大镜内容**:当鼠标移动时,更新放大镜中的图片源,使其始终显示鼠标下方图片的放大区域。这通常通过设置`background-position` CSS属性来实现。 6. **添加动画效果**:为了提升用户体验,可以使用...

    WPF 鼠标拖动图片放大缩小

    然后,在`MouseMove`事件中计算鼠标的移动距离,根据此距离来改变图片的位置和大小。最后,在`MouseLeftButtonUp`事件中结束拖动。 ```csharp private Point? _startPoint; private double _scaleFactor = 1.0; ...

Global site tag (gtag.js) - Google Analytics