2 zengyunhua1992 zengyunhua1992 于 2016.09.14 23:10 提问

鼠标放在小图上面,下面显示相应大图

我的代码如下图:图片说明

4个回答

qq_29594393
qq_29594393   Ds   Rxr 2016.09.15 00:29
已采纳

可以实现了,你看一下效果吧

   $(function(){
        $("td").hover(function(e){
            //自己加一个判断,e.pageY-90<0或者epageX-60<0的话就设置为0
            //自己调整这个值,就能控制位置
            $('div.info').html($(this).html()).toggle().css({
                "top":e.pageY-90,
                "left":e.pageX-60
            })
        })

    })

        <style>
 .info{
    width: 150px;
    height: 60px;
    border: 1px solid gold;
    background-color: wheat;
    border-radius: 10px;
    position: fixed;
    display: none;
 }
</style>

<p>545</p>
    <p>545</p>

    <p>545</p><p>545</p>
    <div class="info">

    </div>
      <table id="tba">
   <tr>
       <td > Homel</td>
       <td > About</td>
       <td >Subscribe RSS</td>
   </tr>
    </table>
qq_29594393
qq_29594393 回复zengyunhua1992: 545 没有任何作用,由于没有边界检测,要把table放屏幕中间,不加这个在屏幕边缘就会在屏幕外显示气泡,加了边界检测后,就不用了
大约一年之前 回复
zengyunhua1992
zengyunhua1992 你这个545有什么用呢?用不着的啊,好像是有这么个意思了,我的代码也接近,不过有点不完美
大约一年之前 回复
qq_29594393
qq_29594393 回复zengyunhua1992: 加个QQ吧 354656610
大约一年之前 回复
zengyunhua1992
zengyunhua1992 我发私信给你看看,我写的,有点小小问题
大约一年之前 回复
devmiao
devmiao   Ds   Rxr 2016.09.14 23:55
mscygg
mscygg   2016.09.15 01:00

这个是要定义CSS样式的,要用到绝对定位和相对定位,然后在用JS 的移入和移除功能就能实现

himiky
himiky   2016.09.15 21:03

可能使用JQuery来实现。

Csdn user default icon
上传中...
上传图片
插入图片
准确详细的回答,更有利于被提问者采纳,从而获得C币。复制、灌水、广告等回答会被删除,是时候展现真正的技术了!