ساخت منو عمودی باز شونده

[mr.amani]

سلام دوستان
تو این سایت (http://www.engeniusnetworks.com/) یه منو کنار اسلایدر اصلی سایت قرار داره
این منو رو چطوری درست کنم؟
کسی میتونه کمکم کنه؟
میخوام مثل همین منو، وقتی روی منو میرم یه متن به همراه تصویر زیرش باز بشه.
http://www.engeniusnetworks.com (http://www.engeniusnetworks.com/)

[meysam1366]

سلام دوست عزیز

ببین این به کارت میاد

[mr.amani]

نه منظورم این نیست

[khateratean]

به نظم، هم با javascript می شه این کار رو پیاده کرد و هم با CSS
از طریق JavaScript که خیلی راحته، می شه با استفاده از رویداد onmouseover هر موقع که موس روی متن قرار گرفت، عکس مورد نظرمون رو نمایان کنیم.
برای اطلاع بیشتر به لینک زیر مراجعه کنید:
http://beyamooz.com/javascript/185-dom/576-%D8%B1%D9%88%DB%8C%D8%AF%D8%A7%D8%AF%D9%87%D8%A7%D B%8C-%D8%B9%D9%86%D8%A7%D8%B5%D8%B1-HTML-%D8%AF%D8%B1-%D9%85%D8%AF%D9%84-DOM

اگه می خواهید از CSS استفاده کنید که باز کار خیلی ساده تر می شه
باید از شبه کلاس hover استفاده کنید (در واقع زمانی که موس روی عنصر مورد نظر شما قرار گرفت style آن به چیزی که شما تعیین کرده اید تغییر می کند)
http://beyamooz.com/css/87-advance/295--%D8%B4%D8%A8%D9%87-%DA%A9%D9%84%D8%A7%D8%B3-%D9%87%D8%A7-%D8%AF%D8%B1-CSS

[mr.amani]

به نظم، هم با javascript می شه این کار رو پیاده کرد و هم با CSS
از طریق JavaScript که خیلی راحته، می شه با استفاده از رویداد onmouseover هر موقع که موس روی متن قرار گرفت، عکس مورد نظرمون رو نمایان کنیم.
برای اطلاع بیشتر به لینک زیر مراجعه کنید:
http://beyamooz.com/javascript/185-dom/576-%D8%B1%D9%88%DB%8C%D8%AF%D8%A7%D8%AF%D9%87%D8%A7%D B%8C-%D8%B9%D9%86%D8%A7%D8%B5%D8%B1-HTML-%D8%AF%D8%B1-%D9%85%D8%AF%D9%84-DOM

اگه می خواهید از CSS استفاده کنید که باز کار خیلی ساده تر می شه
باید از شبه کلاس hover استفاده کنید (در واقع زمانی که موس روی عنصر مورد نظر شما قرار گرفت style آن به چیزی که شما تعیین کرده اید تغییر می کند)
http://beyamooz.com/css/87-advance/295--%D8%B4%D8%A8%D9%87-%DA%A9%D9%84%D8%A7%D8%B3-%D9%87%D8%A7-%D8%AF%D8%B1-CSS

از راهنماییت ممنون ولی من چیزی از این قسمت که گذاشتی متوجه نشدم
قسمت " خودتان امتحان کنید " کار نمیکنه!
ولی منظورم رو هم فکر کنم درست متوجه نشدی
منظورم اینه که منویی داریم که چندتا عنوان مثلا به اندازه 100 * 35 پیکسل داریم که قراره روی هر کدوم از این منوها موس بره زیر منویی باز بشه (بصورت کشویی) که داخل یه جدول یه عکس و یه توضیح متنی برای اون عکس داشته باشم.
این سایت رو ببین EnGenius (http://www.engeniusnetworks.com/)
منویی که منظور منه کنار اسلایدر این سایت ، سمت راستش قرار داره
فکر کنم این با کمک جاوا یا جی کوئری درست کرده
حالا من میخوام ببینم با css تنها هم میشه همچین چیزی درست کرد یا نه؟
اگر نمیشه لطفا بگید با جاوا یا جیکوئری چطوری درستش کنم.
من جاوا بلد نیستم.

[Javidhb]

میتونید عکسها رو توی همون منو بزارید و display: none رو براشون تعریف کنید.

با jquery : (یه همچین چیزی)
()hover (http://api.jquery.com/hover/)


$( "li" ).hover(
function() {
$(this).children('img').show();
},
function() {
$(this).children('img').hide();
}
);

[_mojitaba_]

اگه منظورتون اون منوی کناریه بله با سی اس اس میشه

http://p30up.ir/images/8t2ysjy1isccbsrigcg.zip

[mr.amani]

اگه منظورتون اون منوی کناریه بله با سی اس اس میشه

http://p30up.ir/images/8t2ysjy1isccbsrigcg.zip
دادا پ جدولش کو؟!

[_mojitaba_]

خب شما گفتی کمک کنید نگفتی که منو رو بدید :D

http://p30up.ir/images/kv6r31dwmkzgbjvgkyu.zip

[mr.amani]

خب شما گفتی کمک کنید نگفتی که منو رو بدید :D

http://p30up.ir/images/kv6r31dwmkzgbjvgkyu.zip

مجتبی جان خیلی لطف کردی :قلب:
چطوری درستش کردی؟
همون چیزی شد که می گفتم.

[mr.amani]

میتونید عکسها رو توی همون منو بزارید و display: none رو براشون تعریف کنید.

با jquery : (یه همچین چیزی)
()hover (http://api.jquery.com/hover/)


$( "li" ).hover(
function() {
$(this).children('img').show();
},
function() {
$(this).children('img').hide();
}
);


جاوید جان میشه یه توضیحی درباره این کدایی که نوشتی بدی بدونم طرز کارش چطوریه؟
چی واسه چیه؟

[Javidhb]

hover دو تا تابع میگره که اولیش برای حالتی که موس روی المنت مورد نظرتون میره و دومین تابع برای وقتی که موس از روی اون المنت خارج میشه..
بجای اینکه دوتا تابع جدا برای mouseover و mouseleave بنویسید با jquery بصورت جمع و جور تر با ()hover این کار رو میتونید انجام بدید.

دمـــو (http://jsfiddle.net/2CGx8/)

[_mojitaba_]

مجتبی جان خیلی لطف کردی :قلب:
چطوری درستش کردی؟
همون چیزی شد که می گفتم.

هیچی اولش display عکس رو none قراردادم
بعد گفتم وقتی موس روی متن رفت display عکس رو block کنه

[mr.amani]

هیچی اولش display عکس رو none قراردادم
بعد گفتم وقتی موس روی متن رفت display عکس رو block کنه

راستی تو اون سایت که بهت گفتم اولین عکس بطور پیش فرض نشون داده میشه ولی تو اینی که شما فرستادی برام اینطوری نیست!
چطوری میشه اولین منو رو پیش فرض نمایش بده؟
لطفا بهم یاد بده
اگه حال داشتی فیل شم بذار
تشکر :قلب: