برگزیده های پرشین تولز

اضافه شدن عکس یا متن جدید با بردن موس روی متن یا عکس دیگر

mhd07

کاربر تازه وارد
تاریخ عضویت
29 می 2012
نوشته‌ها
51
لایک‌ها
0
سلام به همگی...

سوالم از عنوان تاپیک مشخصه
smilingsmiley.gif
حالا یه توضیح بدم:

من میخوام وقتی که نشانگر موس رو روی یک متن یا عکسی میبرم بلافاصله یه متن یا یه عکس جدید ( با طول و عرض دلخواه و قابل تغییر ) در کنارش نشون داده بشه طوری که متن یا عکس قبلی هم پیدا باشه

مثل حالت راهنمایی برای بازدید کننده سایت میمونه که نمیدونه این عکس یا آیکون توی سایت به چه معنی هست و
با بردن موس روی اون عکس یا آیتم ، عکس جدید به عنوان راهنما ظاهر بشه

فقط یه نکته اینکه نمیخوام که با کلیک موس روی عکس ، عکس جدید اضافه بشه...همونطور که بالا گفتم بلافاصله با بردن نشانه گر موس.

با تشکر
 
Last edited:

Hasam

Registered User
تاریخ عضویت
2 اکتبر 2007
نوشته‌ها
665
لایک‌ها
159
محل سکونت
flynic.ir
سلام به همگی...

سوالم از عنوان تاپیک مشخصه
smilingsmiley.gif
حالا یه توضیح بدم:

من میخوام وقتی که نشانگر موس رو روی یک متن یا عکسی میبرم بلافاصله یه متن یا یه عکس جدید ( با طول و عرض دلخواه و قابل تغییر ) در کنارش نشون داده بشه طوری که متن یا عکس قبلی هم پیدا باشه

مثل حالت راهنمایی برای بازدید کننده سایت میمونه که نمیدونه این عکس یا آیکون توی سایت به چه معنی هست و
با بردن موس روی اون عکس یا آیتم ، عکس جدید به عنوان راهنما ظاهر بشه

فقط یه نکته اینکه نمیخوام که با کلیک موس روی عکس ، عکس جدید اضافه بشه...همونطور که بالا گفتم بلافاصله با بردن نشانه گر موس.

با تشکر

HTML:
<img id="first" /><img id="second" />

<style type="text/css">
#second { visibility: hidden; }
#first:hover #second { visibility:visible; }
</style>
 

mhd07

کاربر تازه وارد
تاریخ عضویت
29 می 2012
نوشته‌ها
51
لایک‌ها
0
اول یه تشکر کنم از اینکه جواب میدید ؛ دوم اینکه من الان کد پایین رو توی سایت های تست آنلاین کدهای Html میزنم قسمت link هم آدرس دو عکس رو میدم ولی فقط عکس اولی ( id="first" ) رو نشون میده و با بردن موس روی عکس خبری از عکس دوم نیست


کد:
<img id="first" src="link" /><img id="second" src="link" />

<style type="text/css">
#second { visibility: hidden; }
#first:hover #second { visibility:visible; }
</style>
 

Hasam

Registered User
تاریخ عضویت
2 اکتبر 2007
نوشته‌ها
665
لایک‌ها
159
محل سکونت
flynic.ir


اول یه تشکر کنم از اینکه جواب میدید ؛ دوم اینکه من الان کد پایین رو توی سایت های تست آنلاین کدهای Html میزنم قسمت link هم آدرس دو عکس رو میدم ولی فقط عکس اولی ( id="first" ) رو نشون میده و با بردن موس روی عکس خبری از عکس دوم نیست


کد:
<img id="first" src="link" /><img id="second" src="link" />

<style type="text/css">
#second { visibility: hidden; }
#first:hover #second { visibility:visible; }
</style>

بله، اشتباه از من بوده. تست نکرده بودم.

این ویرایش جدید:
HTML:
<style type="text/css">
.first { background:red; width:48px; }
.second { display:none; }
.first:hover .second { display:block; }
</style>

<div class="first">
<img src="http://173.194.35.2/images/icons/product/chrome-48.png" />
<div class="second"><img class="second" src="http://173.194.35.2/images/srpr/logo4w.png" /></div>
</div>
 

b.soshiant

کاربر تازه وارد
تاریخ عضویت
15 ژانویه 2013
نوشته‌ها
7
لایک‌ها
4
منم این مشکل رو دارد
اون عکسی که در پایین سایت هست: کافه کتاب میخوام وقتی ماوس میره روش ی عکس جایگزین نشون بده. ترجیحا یه تکه کد html باشه و مجبور نشیم توی ریشه سایت چیز اضافلع ای بذاریم بهتره
 

sinarigi

کاربر تازه وارد
تاریخ عضویت
31 آگوست 2018
نوشته‌ها
3
لایک‌ها
0
سن
23
محل سکونت
مراغه
خیلی خوب بود ممنون فقط خ رو بخون ی چیز مهم فرستادم.. مرسی از آقا حسام;)

هاست رایگان | هاست دانلود | هاست لینوکس
 
بالا