Is it something wrong or jquery bug?
So we have such code for example and in third click the layer don't change to bottom again..
<style type="text/css">
#menu1 {
width:100%;
height:32px;
overflow:hidden;
background:#ff0033;
position:fixed;
left:0px;
cursor:pointer;
bottom:174px;
}
#content1 {
position:fixed;
width:100%;
left:0;
overflow:auto;
background:blue;
height:200px;
bottom:300px;
}
</style>
<script type="text/javascript" src="js/jquery-1.6.1.min.js"></script>
<script type="text/javascript">
$(function(){
var click1=0;
$("#menu1").click(function () {
if (click1==0) {
$("#content1").css({ bottom: "250px", display: "block", position: "fixed" });
click1 = 1;
} else {
$("#content1").css({ top: "100px", "display": "block", display: "block", position: "fixed" });
click1 = 0;
}
});
});
</script>
Is it something wrong or jquery bug?
So we have such code for example and in third click the layer don't change to bottom again..
<style type="text/css">
#menu1 {
width:100%;
height:32px;
overflow:hidden;
background:#ff0033;
position:fixed;
left:0px;
cursor:pointer;
bottom:174px;
}
#content1 {
position:fixed;
width:100%;
left:0;
overflow:auto;
background:blue;
height:200px;
bottom:300px;
}
</style>
<script type="text/javascript" src="js/jquery-1.6.1.min.js"></script>
<script type="text/javascript">
$(function(){
var click1=0;
$("#menu1").click(function () {
if (click1==0) {
$("#content1").css({ bottom: "250px", display: "block", position: "fixed" });
click1 = 1;
} else {
$("#content1").css({ top: "100px", "display": "block", display: "block", position: "fixed" });
click1 = 0;
}
});
});
</script>
Share
Improve this question
edited Sep 27, 2012 at 4:05
Eli
14.8k5 gold badges61 silver badges77 bronze badges
asked Jun 27, 2011 at 20:03
Andrii K.Andrii K.
1482 gold badges5 silver badges15 bronze badges
1 Answer
Reset to default 5if you have both top
and bottom
set you have issues in that they either both get applied (and height is calculated), or if a height is set, only top
gets applied. So you need to wipe the ones you're not using:
{ bottom: 250, top: 'auto' }
{ top: 100, bottom: 'auto' }