Esto es lo que queria decirle tomese como (pseudocode) pues no se de jQuery
$(window).scroll(function() {
var y = $(window).scrollTop();
if (y < 1000 ){
variable = false;
}
if (y >= 1000 && variable == false){
variable = true;
$(".topmenu").fadeIn(); // > 100px from top - show div
}
});
var variable = false;
$(document).ready(function(){
$(".outmouseover").mouseenter(function(){
$(".outmouseover").fadeOut(0);
});
});
.youdiclass{position:fixed; display:none;width:100px; height:100px; background:red;}
#back{width:300px; height:500px;background:blue; margin:auto;}
.height600{}
.topmenu{
display: none;
position: fixed;
top: 0;
width: 100%;
height: 30px;
background: rgba(255,246,0,1.00);
z-index: 1;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="topmenu outmouseover"></div>
<div id="back" style="background:green";>
</div>
<div id="back">
</div>
<div id="back" style="background:green";>
</div>
<div id="back">
</div>
<div id="back" style="background:green";>
</div>
<div id="back">
</div>
<div id="back" style="background:green";>
</div>
<div id="back">
</div>
<div id="back" style="background:green";>
</div>
<div id="back">
</div>
<div id="back" style="background:green";>
</div>
Nota: Si usted usa exactamente y == 1000
y el scroll es 1001 no se cumple la condicion, entoces no se mostrara, si es eso lo que quiere solo tiene que poner y == 1000 && variable == false
.
gracias, funciona parcialmente porque pretendo que al subir hacia
y=1000 (al pasar por 1000) reaparezca el div. Puedes ayudarme con eso?
creo que esto le puede ayudar en lo que busca:
var variable = false;
var s = 1000;
$(window).scroll(function() {
var y = $(window).scrollTop();
if (y >= s && variable == false){
variable = true;
$(".topmenu").fadeIn(); // > 100px from top - show div
}else if (y < s && variable == true){
variable = false;
$(".topmenu").fadeIn(); // > 100px from top - show div
}
});
$(document).ready(function(){
$(".outmouseover").mouseenter(function(){
$(".outmouseover").fadeOut(0);
});
});
.youdiclass{position:fixed; display:none;width:100px; height:100px; background:red;}
#back{width:300px; height:500px;background:blue; margin:auto;}
.height600{}
.topmenu{
display: none;
position: fixed;
top: 0;
width: 100%;
height: 30px;
background: rgba(255,246,0,1.00);
z-index: 1;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="topmenu outmouseover"></div>
<div id="back" style="background:green";>
</div>
<div id="back">
</div>
<div id="back" style="background:green";>
</div>
<div id="back">
</div>
<div id="back" style="background:green";>
</div>
<div id="back">
</div>
<div id="back" style="background:green";>
</div>
<div id="back">
</div>
<div id="back" style="background:green";>
</div>
<div id="back">
</div>
<div id="back" style="background:green";>
</div>
Nota: Puede que quiera refactorizarlo, pero lo puede tomar como base.