3

こんにちは私は異なるサイズの2つのdivを持つようにコードを更新しました。彼らはcssフロートを使用してアニメーションで位置を切り替える必要があります。

これまでのコードをご覧ください-http://jsfiddle.net/jz5VW/

jQuery(function () {
    jQuery('#switch').click(function () {
        jQuery('#one').animate({
            left: jQuery("#two").offset().left - jQuery("#featured-top").offset().left
        });
        jQuery('#two').animate({
            right: jQuery("#two").offset().left - jQuery("#featured-top").offset().left
        });
    });
});

それらがラッパーの左右に浮く方法はありますか？

本当にありがとう！

4

4 に答える 4

2

トランジション アニメーションを使用するスイッチの場合、次の抜粋を使用できます。

$(function() {
   $('#switch').click(function() {
      $('#one').animate({left:$("#two").offset().left}); 
      $('#two').animate({right:$("#two").offset().left});
   });
});

jsfiddel

パディングとマージンのオプションを覚えておく必要があります...

ラッパー付き:

$(function () {
   $('#switch').click(function () {
       $('#one').animate({
           left: $("#two").offset().left-$("#wrapper").offset().left
       });
       $('#two').animate({
           right: $("#two").offset().left-$("#wrapper").offset().left
       });
   });
 });
于 2013-03-12T08:45:25.810 に答える
0

jquery .animate() を見てください。これはきれいではありません。シフトには動的な値を使用する必要があります。 シンプルなダミーアニメーション 

$('#switch').on("click", function ()  { 
    $('#one').animate({
        right: '-=500',
      }, 5000, function() {})
    $('#two').animate({
        right: '+=500',
      }, 5000, function() {})
});
于 2013-03-12T08:56:48.567 に答える