منو

[omidparkour]

سلام
فرض کنید من یک div دارم که توش یک آیکون 50*50 هست و میخوام وقتی روی این div:hover شد یک div با اندازه ی مثلا 50*150 از زیر اون div که آیکون توشه بیاد بیرون و مثلا توش نوشته باشه خانه بعد دوباره ماوس رو از روی اون Div که توش آیکون هست بردیم کنار اون div که توس نوشته خانه بره زیر div آیکون
چجوری باید اینکارو کرد؟؟

[omidparkour]

یعنی دقیقا عین این چرخ دنده در بالا سایت روبه رو :http://sepehrparsa.ir/#

[omidparkour]

مثل دوتا دسترسی های سریع سایت مجید آنلاینhttp://academy.majidonline.com/

[vimax23]

این که کاری نداره
شما یه دیویژن میسازی بعد هم با css3 روی hover میگی اینقدر حرکت بکنه
مثلا اینطوری (http://jsfiddle.net/N62Y7/)

[omidparkour]

اون رو بلد بودم
اما اون نمونه هایی که نشون دادم که اینجوری نیسن
اول فقط یک آیکون هست و وقتی hover میشه متن نمایش داده میشه

[vimax23]

اون رو بلد بودم
اما اون نمونه هایی که نشون دادم که اینجوری نیسن
اول فقط یک آیکون هست و وقتی hover میشه متن نمایش داده میشه

همونیه که بهت دادم حالا وقت نزاشتم عینشو برات بزنم
شما کاری که میکنی یه دیو تعریف میکنی توش متن عکس یا هر چی دیگه رو میزاری که ثابت هست
برای اون دیو و کلاسش یه استایل برای hover مینویسی که اول افکت انیمیشنی رو داشته باشه دوم هم فاصله از چپ یا راست یا بالا یا پائین مثلا تو مجید آنلاین لینک کردی فاصله از چپ پیدا میکنه میاد به سمت راست
مثلا اینو (http://www.w3schools.com/css/tryit.asp?filename=trycss3_transition1)ببین بلد نیستی آموزش زیاد هست
با جی کوئری هم میشه

[omidparkour]

من کلا منظورم یه چیز دیگه است
عین همون مجید آنلاین میخوام

[omidparkour]

یکی کمک کنه

[hossein-hmd]

برو تو این سایت:
http://www.wordpress-98.ir

[omidparkour]

اون سایتی که دادین برم چی کنم؟

[ab.ali]

اون سایتی که دادین برم چی کنم؟

هیچی برای خنک بازی اومده سایت مسخرش رو تبلیغ می کنه و داره فاتحه می خونه به انجمن!!!!!!!!!
عذر می خوام از دیگر کاربران که این قدر تند نظراتم رو نوشتم!

[tooka123]

کد با کمک جی کوئری

<script>
$(document).ready(function(){
/////////////////////////////
$('div.icon').hover(function(){
$('div.text').css('font-size','13px');
$('div.text').animate({'width':'150px'},'slow');}
,function(){
$('div.text').animate({'width':'0px'},'slow');
$('div.text').css('font-size','0px');
});
/////////////////////////////
});
</script>

<style>
.icon{float:left;}
.text{width:0px; height:50px; float:left; font-size:0px; background-color:#009999;}
</style>


<div class="content">
<div class="icon"><img src="icon.png" width="50" height="50" /></div>
<div class="text">home</div>
</div>