2013-10-12 5 views
0

내 콘텐츠를 다른 콘텐츠와 동일하게 푸시 할 수 있습니까? 좋아요. 질문이 막연한 것처럼 보입니다.하지만 내가하고 싶은 일은 다른 스크립트가 콘텐츠를 푸시하는 방식처럼 내 콘텐츠를 밀어 넣는 것입니다. 버튼을 클릭하면 콘텐츠가 측면에서 밀어 넣어 div가 축소됩니다. 나는 너무 멀지 않아 누군가가 도울 수 있습니다.콘텐츠 자바 스크립트 콘텐츠 푸시

다음
$(function(){ 
    var $trigger = $(".icon-menu-2"); 
    var $menu = $(".c_left"); 

$trigger.toggle(function show() { 
    $menu.animate({ width: 185, marginLeft: 0, display: 'toggle'}, 'slow'); 
    $(".c_right").animate({ marginLeft:185, display:'toggle'}, 'slow'); 
}, function hide() { 
    $menu.animate({ marginLeft: -185, display: 'toggle'}, 'slow'); 
    $(".c_right").animate({ marginLeft:0, display:'toggle'}, 'slow'); 
    }); 
}) 

http://jsfiddle.net/Ndvbn/2/

는 그냥 스크립트와 같은 컨텐츠를 밀어 수 있도록 테스트를 클릭하면 위의 수행까지 단지 작은 손길을 필요로하는 스크립트입니다 :이 작동하는 스크립트입니다. 내 두 번째 스크립트는 왼쪽에있는 컨텐츠를 밀어 수 있도록

var timer; 

$("#slideout").animate({right:'0px', queue: false, duration: "slow"}, function() { 
    timer = setTimeout(function() { 
     $("#slideout").animate({right:'-280px'}, {queue: false, duration: "slow"}) 
    }, 500); 
}); 
$("#clickme2").click(function() { 
    if ($("#slideout").css("right") == "-280px"){ 
     $("#slideout").animate({right:'0px'}, {queue: false, duration: 500}, function() { 
     clearTimeout(timer); 
     }); 
    } else { 
     $("#slideout").animate({right:'-280px'}, {queue: false, duration: 500}, function() { 
     clearTimeout(timer); 
    });} 
}); 

http://jsfiddle.net/5UpHk/4/

이 사람이 코드를 게시 할 수 다음은 스크립트입니다?

답변

0

아래 스크립트는 콘텐츠를 왼쪽으로 푸시합니다. CSS에 대한 몇 가지 변경 사항을 만들었습니다. 여기에서 데모 및 코드를 확인하십시오. http://jsfiddle.net/BdKhW/1/

var timer; 

$("#slideout").animate({width:'275px'}, {queue: false, duration: "slow"}, function() { 
    timer = setTimeout(function() { 
     $("#slideout").animate({width:0}, {queue: false, duration: "slow"}) 
     $(".c_left").animate({marginRight:0}, {queue: false, duration: "slow"}) 
    }, 2000); 
}); 
$(".c_left").animate({marginRight:'275px'}, {queue: false, duration: "slow"}) 

$("#clickme2").click(function() { 
    $("#slideout").animate({width:0}, {queue: false, duration: "slow"}) 
    $(".c_left").animate({marginRight:0}, {queue: false, duration: "slow"}) 
}); 
관련 문제