jquery幻灯片隐藏可见性？

我想实现的东西，如：jquery幻灯片隐藏可见性？

$("#left").hide('slide', {direction: 'right'}, 1000)

但是我不想在div被隐藏，我希望它保持了空间，所以我想有能见度隐象：

$("#left").css('visibility','hidden')

然而，仍然达到与上述相同的效果。

来源

2012-01-12 Jonovono

这就是我要做的

$parent = $('#left').parent(); //store the parent of the element in a variable 
$('#left').clone() //clone the existing element 
.appendTo($parent) // insert it into the current position 
.css('visibility','hidden') //set it's visibility to hidden 
.end().end() //target the initial element 
.slideUp() //do any slide/hide/animation that you want here, the clone will always be there, just invisible

这可能是可怕的，但它是我能想到解决问题的:)

来源

2012-01-12 05:58:25 leopic

例：http://jsfiddle.net/skyrim/j2RWt/4

试试这个：学习什么实际需要为后

var $content = $("#left"); 
var offset = $content.offset(); 
$("<div></div>").css({ 
    width: 0, 
    position: "absolute", 
    left: offset.left, 
    top: offset.top, 
    height: $content.outerHeight(), 
    backgroundColor: "White" 
}).appendTo("body") 
.animate({ 
    width: $content.outerWidth() 
}, 1000, function() { 
    $content.css('visibility', 'hidden'); 
    $(this).remove(); 
});

编辑

所以，（：P），这种方法主要发生在另一个DIV原始元素。我已经在IE上测试过了......我将在其他浏览器上进行进一步测试后，通过更新进行编辑！

编辑

只有Chrome浏览器似乎有与得到正确的高度的问题。

新增的回调从而消除了品牌知名度隐藏（如LEOPiC建议），并删除滑出式DIV

来源

2012-01-12 05:38:07 Skyrim

的唯一途径，我认为在OP真正想要的是滑出向右效果，不仅隐藏元素。 – leopic 2012-01-12 05:40:54

@LEOPiC - 啊，ic ... thnx输入 – Skyrim 2012-01-12 05:42:33

这里是一个小提琴：http://jsfiddle.net/skyrim/j2RWt/4 – Skyrim 2012-01-12 06:20:51

你可以非常简单的方式做到这一点。有一个很好的教程here在不同的方向上动画。它一定会帮助你。试试这个

$('#left').animate({width: 'toggle'});

例：http://jsfiddle.net/2p3FK/2/

编辑：还有一个解决方案，这是非常简单的用left margin

$("#left").animate({marginLeft:'1000px'},'slow');

移动。例如在div窗外：http://jsfiddle.net/2p3FK/1/

来源

2012-01-12 05:51:54

jquery幻灯片隐藏可见性？

回答

相关问题