作者热门文章
- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我对这个幻灯片问题有些疑惑。谁能帮忙把左面板改成右面板?
我的代码:
<!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;
}
关于jquery - Jquery 如何从右向左滑动?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24167839/
目前我正在使用 [self presentModalViewController :newVC animated:YES] 。我想从左/右/顶部/底部呈现带有推送效果的 newViewcontroll
我正在尝试实现“带有上一个和下一个的部分幻灯片”。这些部分的标记如下: Section 1 Section 2 Section 3 Prev Next 除具有 acti
我的问题与此处提出的问题几乎相同:question 不同的是,我想从右边切换第 2 位和第 4 位数字,而不是像另一个问题中那样从左边切换。所以在我的例子中最右边的数字是 1。示例:283926.67
我是一名优秀的程序员,十分优秀!