ورود

View Full Version : سوال: مشکل نمایش عکس پشت سر هم در فایرفاکس


ravand
چهارشنبه 22 آذر 1391, 19:22 عصر
سلام
من برنامه ای نوشتم که وقتی ماوس میره روی عکس ، عکس با یک افکت باز میشه. توی همه ی مرورگر ها به غیر از فایرفاکس که چک کردم مشکلی نداشت. الان وقتی این برنامه رو توی فایرفاکس تست میکنم مشکل داره . وقتی ماوس رو میبرم روی تصویر ، به جای اینکه تصویر باز بشه و بسته نشه . تصویر داخل یک div پشت سر هم باز و بسته میشه. در صورتی که من میخوام وقتی کرسر ماوس رو از روی تصویر برداشتم تصویر بسته بشه.

<html>
<head>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$(".aks").mouseover(function () {
$(".vasat").toggle("slow");
});

$(".aks").mouseout(function () {
$(".vasat").toggle("slow");
});
});
</script>
<style type="text/css">
.aks{
position: absolute;
z-index:1;
}
.vasat{
position:absolute;left:5px;top:10px;z-index:2;
border:1px #CCCCCC solid;
}
</style>
</head>
<body>
<div class="aks"> <img src="naghashi.jpg" width="200"></div>
<div align="center"><div class="vasat" style="display:none"><img src="naghashi.jpg" width="400"></div></div>
</body>
</html>
نتیجه اینکه تصویر در فایرفاکس پشت سرهم باز و بسته میشه که من نمیخوام اینطوری بشه.
متشکرم
hamed_hossani
پنج شنبه 23 آذر 1391, 20:26 عصر
سلام
از
hover(function(){},function(){});
تالع اولی برای موس اور دومی برای موس اوت
ravand
پنج شنبه 23 آذر 1391, 20:40 عصر
ببخشید من با hover کار کردم ولی منظور شما رو از تابع دومی نمی فهمم.
چجوری شما این کد رو توی کدهای من قرار میدید؟ میشه برام بذارید ؟ تا من منظور شما رو بفهمم؟
متشکرم.
hamed_hossani
شنبه 25 آذر 1391, 14:46 عصر
سلام
$(document).ready(function() {
$(".aks").hover(function(){
//mouseover
$(".vasat").toggle("slow");
},function(){
//mouseout
$(".vasat").toggle("slow");
});//end hover
});//end ready
ضمنا کد شما با hover فرقی نمی کنه>گفتم که یادش بگیرید>یه جاهای منحصر به فردی به درد می خورده
نمایش برخط کد ها
http://jsfiddle.net/J696U/
ravand
شنبه 25 آذر 1391, 14:53 عصر
از پاسختون متشکرم.
ولی من بهتون گفتم که اینو قبلا تست کردم و کار نکرده:

<html>
<head>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$(".aks").hover(function(){
//mouseover
$(".vasat").toggle("slow");
},function(){
//mouseout
$(".vasat").toggle("slow");
});//end hover
});//end ready
</script>
<style type="text/css">
.aks{
position: absolute;
z-index:1;
}
.vasat{
position:absolute;left:5px;top:10px;z-index:2;
border:1px #CCCCCC solid;
}
</style>
</head>
<body>
<div class="aks"> <img src="naghashi.jpg" width="200"></div>
<div align="center"><div class="vasat" style="display:none"><img src="naghashi.jpg" width="400"></div></div>
</body>
</html>
توی مرورگر فایرفاکس تست کنید.
hamed_hossani
شنبه 25 آذر 1391, 18:44 عصر
این تغییرات را دادم>ان چیزی شده که می خواستید
$(document).ready(function() {
$(".aks").hover(function(){
//mouseover
$(".vasat").addClass('open');//.css('display','block');
},function(){
//mouseout
// $(".vasat").css('display','none');
});//end hover
$('.vasat img').mouseout(function(){
$(".vasat").removeClass('open');//.css('display','none');
});
});//end ready
در قسمت css
.aks{
display:inline-block;
position:relative;
}
.vasat{
display:none;
border:1px #CCCCCC solid;
}
.open{
display:block;
position:absolute;;
left:5px;
top:5px;
}
ravand
شنبه 25 آذر 1391, 19:21 عصر
:قهقهه: اگه من میخواستم همچین چیزی به این سادگی رو بسازم که از همون hover توی css استفاده میکردم و اینقدر بدبختی نمی کشیدم . بابا دستور toggle خودش یه نمایش قشنگی ایجاد میکنه . عکس میخواستم توی یه div باز بشه و در یه لایه روی همه ی لایه ها. برو کد منو تست کن. البته به غیر از فایرفاکس.
بیخیال . من اصلا از کار کردن با این برنامه منصرف شدم . هر چی بدبختی می کشیم از این تفاوت در مرورگرهاست :لبخند:
از لطفت که وقت گذاشتی متشکرم