what I'm trying to do is to keep video in .slideDown until mouseout text AND video, is that possible? here's my code until now
Both #text and #video are div
JS here:
<script>
$(document).ready(function(){
$("#text").mouseover(function(){
$("#video").slideDown("slow");
});
$("#video").mouseout(function(){
$("#video").slideUp("slow");
});
});
</script>
CSS here:
#text
{
margin-top:20px;
float:center;
font:VNF-Museo;
font-size:40px;
color: #333;
margin-left:auto;
margin-right:auto;
}
#video
{
display:none;
width:1024px;
height:278px;
}
I looked for a solution but couldn't find something that close. Thank you
I'm not 100% sure this is what you are trying to do, but i hope it helps:
$(document).ready(function() {
$("#wrap").mouseover(function() {
$("#video").stop().slideDown("slow");
});
$("#wrap").mouseout(function() {
$("#video").slideUp("slow");
});
});
#text {
margin-top: 20px;
float: center;
font: VNF-Museo;
font-size: 40px;
color: #333;
margin-left: auto;
margin-right: auto;
border: 1px solid #000;
}
#video {
display: none;
width: 1024px;
height: 278px;
border: 1px solid #000;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<div id="wrap">
<div id="text">text</div>
<div id="video">video</div>
</div>
Another example: http://jsfiddle.net/ZyUYN/