a86356 2015-04-17 06:24 采纳率: 28.6%
浏览 1675
已采纳

jq的弹出层的一个问题

 <div class="box1">11</div>
<div class="box2">12</div>

要做一个效果,box1刚开始是隐藏的,点了box2之后,box1慢慢从box2里面上升,升到他原来的地方。jq该怎么写

  • 写回答

2条回答

  • Go 旅城通票 2015-04-17 08:19
    关注

    animiate方法就行了,需要将box1预先设置的top存储起来,然后定位到box2去。点击动态移动到原始位置

     <script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.4.2.min.js"></script>
    <style>
    .box1,.box2{position:absolute;left:50%;top:50%;width:100px;height:100px;border:solid 1px #000}
    .box1{display:none;top:100px;left:100px;z-index:100}
    </style>
     <div class="box1">11</div>
    <div class="box2">12</div>
    <script>
        $(function () {
            var box1 = $('div.box1'), box2 = $('div.box2')
            , box1p = { top: box1.css('top'), left: box1.css('left') };
            box1.css({ top: box2.css('top'), left: box2.css('left') });
            box2.click(function () {
                box1.show().animate(box1p, 1000);
            });
        });
    </script>
    
    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论
查看更多回答(1条)

报告相同问题?

悬赏问题

  • ¥15 这个电路是如何实现路灯控制器的,原理是什么,怎么求解灯亮起后熄灭的时间如图?
  • ¥15 matlab数字图像处理频率域滤波
  • ¥15 在abaqus做了二维正交切削模型,给刀具添加了超声振动条件后输出切削力为什么比普通切削增大这么多
  • ¥15 ELGamal和paillier计算效率谁快?
  • ¥15 file converter 转换格式失败 报错 Error marking filters as finished,如何解决?
  • ¥15 ubuntu系统下挂载磁盘上执行./提示权限不够
  • ¥15 Arcgis相交分析无法绘制一个或多个图形
  • ¥15 关于#r语言#的问题:差异分析前数据准备,报错Error in data[, sampleName1] : subscript out of bounds请问怎么解决呀以下是全部代码:
  • ¥15 seatunnel-web使用SQL组件时候后台报错,无法找到表格
  • ¥15 fpga自动售货机数码管(相关搜索:数字时钟)