jquery在末尾保存css时传递效果 - jquery transfer effect holding css at end

jquery transfer effect holding css at end

本文关键字：css 保存 jquery | 更新日期: 2023-09-27

所以我正在制作一个应用程序，利用查询ui的效果（"transfer"）。一切正常。但在动画结束时，属于effect.ui效果转移的css标记就消失了。我希望它能留在页面上。

这可能吗？

这是我的代码javascript代码。

  <script>
@foreach  ($stimuli['comparison'] as $stimulus)
    @if($stimuli['sample'][0] == $stimulus)
$("#sample").effect("transfer", {to: $("#{{ $stimulus }}")}, 9000);
        @endif
@endforeach

</script>

编辑

因此，我的直觉是为css创建第二个div。基本上是在动画结束时手动定位。但我想知道是否有更好更简单的方法？因为我想保持元素的大小与传输处理css内容图像的方式相同。

CSS

    .ui-effects-transfer {
    background-image :url("http://images.clipartpanda.com/finger-clipart-pointing-finger-md.png");
    opacity: .8;
    margin-top: 125px;
    z-index: 5 !important; 
  }

问题http://jsfiddle.net/qq8q7357/3/

这就是我的问题。

在动画制作过程中，图片高于一切。我希望它结束时把图片放在div顶部的确切位置，而不是设置为背景图像。

动画完成后，使用functions complete方法将类添加回元素。这是的文档

Jquery UI

 $("#sample").effect("transfer", {to: $("#{{ $stimulus }}")}, 9000,function(){
       $('#{{ $stimulus }}').addClass('ui-effects-transfer');
 });

编辑：

.ui-effects-transfer {
   background-image :url("http://images.clipartpanda.com/finger-clipart-pointing-finger-md.png") no-repeat;
   opacity: .8;
   z-index: 5 !important;
   background-size:20px 20px; //hand size
   // Use background postion not margin to move the image;
   background-position: 0px 125px;
}