gpt4 book ai didi

jquery - Jquery 如何从右向左滑动?

转载 作者:行者123 更新时间:2023-11-28 17:40:46 24 4
gpt4 key购买 nike

我对这个幻灯片问题有些疑惑。谁能帮忙把左面板改成右面板?

我的代码:

<!DOCTYPE html>
<html>
<head>

<style>

.left, .hidden {
float: left;
height:350px;
}

.left {
width: 50%;
background: #fff;
z-index:1;
}

.hidden {
width:7%;
z-index:2;
position:absolute;
left:-1000px;
background:grey;
color:#000;
}


.clear {
clear:both;
}


</style>


<script type="text/javascript" src="http://code.jquery.com/jquery-1.9.1.js"></script>

</head>
<body>


<div class="hidden">Show Me</div>
<div class="left">Left panel</div>

<div class="clear"></div>

<a href="#" id="slide">Show/hide Slide Panel</a>

<script>

$(document).ready(function(){
$('#slide').click(function(){
var hidden = $('.hidden');
if (hidden.hasClass('visible')){
hidden.animate({"left":"-1000px"}, "slow").removeClass('visible');
} else {
hidden.animate({"left":"0px"}, "slow").addClass('visible');
}
});
});

</script>

</body>
</html>

链接可以在这个 Jsfiddle 链接中看到:

http://jsfiddle.net/ZQTFq/

我对这个幻灯片问题有些疑惑。任何人都可以帮助将左面板更改为右面板吗?我对这个幻灯片问题有一些疑问。任何人都可以帮助将左面板更改为右面板吗?我对这个幻灯片问题有一些疑问。谁能帮忙把左面板改成右面板?

最佳答案

将所有 css 属性从“左”更改为“右”。在你的 jQuery 动画代码中做同样的事情。

.left, .hidden {
float: left;
height:350px;
}

.left {
width: 50%;
background: #fff;
z-index:1;
}

.hidden {
width:25%;
z-index:2;
position:absolute;
right:-1000px;
background:#f90;
color:#000;
}

.right {
width:50%;
float: right;
height:350px;
background:#000;
color:#fff;
}

.clear {
clear:both;
}

http://jsfiddle.net/ZQTFq/1763/

关于jquery - Jquery 如何从右向左滑动?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24167839/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com