کد نمایش متن با رفتن روی عکس

[runy 221]

سلام

می خوام وقتی کاربر میره روی عکس عکس مات بشه و یه متن را نمایش بده یا اصلا با یک بکگراند متن نمایش داده بشه

مثل سایت زیر :

http://www.marceloduende.com/

کسی کدش را سراغ داره ؟؟؟

ممنون

[M.Javad 684]

با دستود hover بر روی عکس میتونید اعمال خودتون رو انجام بدید

برای مات شدن عکس میتونید از دستور opacity استفاده کنید که از 0.1 به بالا قابل تغییر هستش

[runy 221]

با دستود hover بر روی عکس میتونید اعمال خودتون رو انجام بدید

برای مات شدن عکس میتونید از دستور opacity استفاده کنید که از 0.1 به بالا قابل تغییر هستش

میدونم ولی مشکلم اینکه نمی تونم متن را بیارم روی عکس نمایش بدم

[علی زینلی 2114]

سلام

متأسفانه نتونستم سایتم رو ببینم (نتم مشکل دار هست)

ولی از حرفات این رو متوجّه شدم:

  a.hovertext {
    position: relative;
    text-decoration: none !important;
    text-align: center;
  }
a.hovertext:after {
    background:inset none repeat scroll 0 0 rgba(0, 0, 0, 0.8);    bottom: 0;
    background-color:#000;
    color: #fff;
    content: attr(title);
    left: 0;
    margin: 0 -25px;
    opacity: 0;
    padding: 0.5em 3px;
    position: absolute;
    text-decoration: none !important;
    transition: all 0.5s ease 0s;
    width: 100px;
}  a.hovertext:hover:after, a.hovertext:focus:after {
    opacity: 1.0;
  }

کافیه اینجوری ازش استفاده کنی:

<a href="یه لینک میتونه سایت خودتم باشه" class="hovertext"><img src="آدرس_عکس"></a>

موفّق باشی.

[runy 221]

سلام متأسفانه نتونستم سایتم رو ببینم (نتم مشکل دار هست) ولی از حرفات این رو متوجّه شدم:

 a.hovertext { position: relative; text-decoration: none !important; text-align: center; } a.hovertext:after { background:inset none repeat scroll 0 0 rgba(0, 0, 0, 0.8); bottom: 0; background-color:#000; color: #fff; content: attr(title); left: 0; margin: 0 -25px; opacity: 0; padding: 0.5em 3px; position: absolute; text-decoration: none !important; transition: all 0.5s ease 0s; width: 100px; } a.hovertext:hover:after, a.hovertext:focus:after { opacity: 1.0; }

کافیه اینجوری ازش استفاده کنی:

[url="یه%20لینک%20میتونه%20سایت%20خودتم%20باشه"][img=آدرس_عکس][/url]

موفّق باشی.

ممنون ولی کجاش متن را بنویسم ؟

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

[علی زینلی 2114]

ممنون ولی کجاش متن را بنویسم ؟ یه بکگراند سیاه نمایش میده ولی توش متن نمیتونم بیارم

عذر میخوام که توضیحات بیشتر رو ندادم.

باید در قسمت تایتل تگ <a> بنویسید

مثلاً:

<a href="http://yemesal.com" class="hovertext" title="متنی که میخوای نمایش داده بشه">

میتونی با عوض کردن این قسمت از title به هرچیزی که دلت خواست بیاریش ولی ایده آلش title هست

content: attr(title);