PDA

View Full Version : سوال: مشکل در animation - و mouseover !



siavashsay
پنج شنبه 26 بهمن 1391, 17:58 عصر
دوستان بنده یک Div دارم که در صورتی که موس بروی اون میره یک animation اجرا میشه !
مشکل من اینجاس که داخل اون Div چند Div دیگه هم دارم که وقتی موس بروی اونها میره دوباره animation اجرا میشه !
اگه بخوام بهتر توضیح بدم قضیه اینه که یه جدول با div درست کردم که داخل اون برای لیست اطلاعات جدول هم از div استفاده کردم ( table less ) !
حالا بروی جدول ( div اصلی ) وقتی mouseover میشه اون جدول 10 پیکسل به راست هدایت میشه ( به صورت animation ) حالا وقتی موس بروی div های داخلی اون جدول میره انگار یک بار دیگه تابع animation رو فراخوانی و اجرا میکنه ! نتیجه این میشه که هربار که موس روی جدول میره جدول حالت رفت و برگشتی به خودش میگیره و مدام هی تابع رو اجرا میکنه و animation تکرار میشه !
ممنون میشم اگر کمک کنید !
با تشکر :)

siavashsay
پنج شنبه 26 بهمن 1391, 23:25 عصر
دوستان من تست کردم دیدم مشکل از jquery و animation نیست !
کلا css این مشکل رو داره ! مثلا اگر یک جدول درست کنید که به اون خاصیت hover بدید که رنگش مثلا عوض شه ..
بعد توی همون جدول یک div درست کنید ...
وقتی موس روی اون div توی جدول میره خاضیت hover کار نمیکنه ! مشکل من اینجاس الان !
اون div مثل اینه که یک layer درست کنه تا جلوی hover رو بگیره ! با اینکه اون div توی اون جدول هست یعنی زیر مجموعه اون جدول ( div اصلی ) هست !
نمیدونم باید چکار کرد :)

2undercover
جمعه 27 بهمن 1391, 06:04 صبح
خوب می تونید از دو تا Selector استفاده کنید:#Table:hover,#Table *:hover

exlord
جمعه 27 بهمن 1391, 09:12 صبح
به div یه ID بدین و با استفاده از id سلکت کنین ...
$('div#divID')
برای راهنمایی بیشتر کد html و js رو اینجا قرار بدین ...

siavashsay
جمعه 27 بهمن 1391, 11:00 صبح
دوستان ! ممنونم بابت پاسخ هاتون !
اما مشکل چیز دیگه ای هست !
بنده اصلا از Table استفاده نکردم ! ( در جواب دوست عزیز اول )
مشکل کلا از CSS هست نه jQuery !
بنده روی Div اصلی خاصیت mouseover رو قرار دادم که با رفتن موس روی اون یک تابع فراخوانی میشه :


<div id="myDiv" class="myDiv" onmouseover="doFunc('<?php echo $id;?>')" onmouseout="doFunc2('<?php echo $id;?>')">
<div> <?php echo $Name;?> </div>
<div> <?php echo $email;?> </div>
</div>
بنده یک همچین کدی ( مثال هست ) رو دارم ! حالا موس که روی div اصلی میره توابع فراخوانی میشن - اما وقتی روی اون 2 تا دیو داخلی که میره و باز میاد روی div اصلی توابع مجدد فراخوانی میشن !
البته دیشب متوجه شدم کلا از مشکل از CSS هم هست نه jQuery !
اما حالا که عنوان شده آیا راه حلی برای این مشکل دارید ؟!
با تشکر :)

exlord
جمعه 27 بهمن 1391, 12:11 عصر
از jQuery برای EventHandling استفاده بکنی مشکلت حل میشه ...
$('#myDiv').hover(function (e) {
console.log('hover');
}, function () {
console.log('out');
});

siavashsay
جمعه 27 بهمن 1391, 12:50 عصر
ممنونم - اما مشکل حل شد دوست عزیز !
مشکل بنده این بود که نباید از mouseout استفاده میکردم - باید از mouseleave استفاده میکردم !
علت اینکه نمیتونستم از jQuery استفاده کنم به خاطر این بود که تعداد جداول زیاد هستند و دستور mouseover - mouseleave باید حتما از خود جداول صادر شن تا یک آیدی به تابع مورد نظر بفرستن که animatio تنها بروی همون جدول مورد نظر که موس روی اون هست اعمال شه !
به هر حال خیلی ممنونم :)
متشکرم که پاسخگو و پیگیر بودید :)

exlord
جمعه 27 بهمن 1391, 13:45 عصر
برای هرکاری راح حل اصولی هست ...

<div id="myDiv" class="myDiv" data-id='<?=$id;?>'>
فکر میکنم تا حالا از this استفاده نکردین ؟؟؟
$('#myDiv').hover(function (e) {
doSomthing($(this).attr('data-id'));
}, function () {

});

siavashsay
جمعه 27 بهمن 1391, 13:51 عصر
جالب بود !
اما داخل تابع بنده فقط اون Div تغییر پیدا نمیکنه ! چند div با ID های دیگه هم شامل تغییرات میشن ! مثلا :

function doF(id){
$("#tbDiv"+id).css("border-color","#e5e5e5");
$("#listDiv"+id).animate({left:'0px'},200);
$("#arrowDiv"+id).animate({left:'17px'},200);
}
آیا با راه حلی که شما فرمودین سرعت اجرای تابع و یا animation بهتر میشه ؟!

exlord
جمعه 27 بهمن 1391, 16:31 عصر
توی سرعت اجرا تاثیری نداره فقط باعث کاهش حجم کد html و نظم بیشتر میشه ...
در ضمن در این صورت باید به جای id از class برای select استفاده بکنین
$('.myDiv')