使用jQuery实现图片内容的放大(提示)

布满荆棘的人生 2022-08-07 15:58 141阅读 0赞

<script type="text/javascript">  
  
$(function()\{  
    var x = 10;  
    var y = 20;  
    $("a.tooltip").mouseover(function(e)\{  
        this.myTitle = this.title;  
        this.title = "";      
        var tooltip = "<div id='tooltip'><img src='"+ this.href +"' alt='产品预览图'/><\\/div>"; //创建 div 元素  
        $("body").append(tooltip);    //把它追加到文档中                          
        $("\#tooltip")  
            .css(\{  
                "top": (e.pageY+y) + "px",  
                "left":  (e.pageX+x)  + "px"  
            \}).show("fast");      //设置x坐标和y坐标，并且显示  
    \}).mouseout(function()\{  
        this.title = this.myTitle;      
        $("\#tooltip").remove();     //移除  
    \}).mousemove(function(e)\{  
        $("\#tooltip")  
            .css(\{  
                "top": (e.pageY+y) + "px",  
                "left":  (e.pageX+x)  + "px"  
            \});  
    \});  
\})  
  
</script>

发表评论取消回复

表情：

评论列表（有 0 条评论，141人围观）

还没有评论，来说两句吧...

相关阅读

相关 jquery 实现图片放大

文章目录一、html、Jquery代码如下二、效果 2.1、初始化加载的页面 2.3、鼠标放到图片

超、凢脫俗/ 2023年07月16日 03:40/ 0 赞/ 6 阅读

相关 jquery图片放大

jquery 图片放大 [点击查看图片放大效果][Link 1] [http://api.buruyouni.com/static/demo/%E6%94%BE%E5%A

爱被打了一巴掌/ 2023年07月13日 10:53/ 0 赞/ 6 阅读

相关使用JQuery实现简单的图片切换

1.html代码 <div id="slides-show"> <div class="slides-wrap"> <div class

快来打我*/ 2022年08月27日 04:51/ 0 赞/ 218 阅读

相关使用jQuery实现input的灰色提示信息

JS代码： / Input框里的灰色提示，使用前先引入jquery <br>使用方法：<input type="text" tipMsg="您

Myth丶恋晨/ 2022年08月22日 14:24/ 0 赞/ 239 阅读

相关使用jQuery实现图片内容的放大(提示)

<!-- 所以受到启发，超链接<a>标签本身有一个title属性，可以完成文本提示，但

布满荆棘的人生/ 2022年08月07日 15:58/ 0 赞/ 142 阅读

相关 jquery与jQzoom实现图片放大效果

前段时间在网店看到物体图片放大的功能，我一直再猜这是怎么实现的，直到今天才知道原来是jquery与jQzoom结合的效果。下面是从官网抠过来的文字： 1.引用js

阳光穿透心脏的1/2处/ 2022年08月05日 15:15/ 0 赞/ 236 阅读

相关图片的自动放大

图片的自动放大效果大概是今天早上10点钟的样子，我就接收到一个消息，需要进行图片的动态效果，给出的效果图如下： ![效果图][SouthEast]

朴灿烈づ我的快乐病毒、/ 2022年06月14日 06:44/ 0 赞/ 200 阅读

相关 jQuery实现图片的放大以及点击图片，放大图片出现在弹出层。

又学习了一个小demo，并运用到了后台的管理系统中。直接上代码吧 <div class="img-list-box"> <div class="

水深无声/ 2022年05月21日 11:55/ 0 赞/ 470 阅读

相关基于jQuery悬停图片变色放大特效

分享一款基于jQuery悬停图片变色放大特效是一款响应式鼠标悬停图片放大效果代码。效果图如下： ![201505242301509727.jpg][] 在线预览源码下载

灰太狼/ 2022年03月31日 17:29/ 0 赞/ 254 阅读

相关 Element(2) 表格中实现图片的单击放大、悬浮放大、长按放大

一、实现效果如下图所示，打算实现一个在table表格中点击图片放大的效果【这里也可以是悬浮放大、长按放大等效果】 ![在这里插入图片描述][watermark_ty

痛定思痛。/ 2021年12月15日 14:59/ 1 赞/ 1502 阅读