konjkav

درخواست افکت برای تصاویر سایت

4 پست در این موضوع قرار دارد

سلام خدمت همه دوستان

یه افکت برای عکس های سایت میخوام که مثلا وقتی موس رو میاریم رو عکس یه عکس Play رو نشون بده رو عکس.

کسی کدی؟ پلاگینی؟ چیزی داره واسه این کار؟

ممنون...

به اشتراک گذاری این پست


لینک به پست

سلام بر شما

این آموزش رو مطالعه کنید.. :

http://forum.wp-parsi.com/tutorials/article/367-%D8%A7%DB%8C%D8%AC%D8%A7%D8%AF-%D8%B5%D9%81%D8%AD%D9%87-%D8%A2%D8%B1%D8%B4%DB%8C%D9%88-%D8%A8%D9%87-%D8%B4%DA%A9%D9%84-%DA%AF%D8%A7%D9%84%D8%B1%DB%8C/

مطلبی که دنبالش هستید میتونید از توش در بیارید. فقط شما میخواید شکل play بیاد اما تو این آموزش یک نوشته میاد روی تصویر که اون هم فکر کنم با کمی تغییر بتونید شکل play رو به جای نوشته بیارید.

موفق باشید

به اشتراک گذاری این پست


لینک به پست

سلام بر شما

این آموزش رو مطالعه کنید.. :

http://forum.wp-pars...و-به-شکل-گالری/

مطلبی که دنبالش هستید میتونید از توش در بیارید. فقط شما میخواید شکل play بیاد اما تو این آموزش یک نوشته میاد روی تصویر که اون هم فکر کنم با کمی تغییر بتونید شکل play رو به جای نوشته بیارید.

موفق باشید

خیلی سخت بود:دی

افزونشو نداریم؟

به اشتراک گذاری این پست


لینک به پست

عجب! :)

شما پس اینو امتحان کن:


<div class="itemsContainer">
<div class="image"> <a href="#"> <img src="http://test.ir/image.jpg" /> </a></div>
<div class="play"><img src="http://test.ir/play.png" /> </div>
</div>

در کد بالا به جای # آدرس لینک دلخواه و به جای test.ir/play.png و test.ir/image.jpg تصاویر دلخواه رو وارد کن. در فایل css قالب این موارد رو قرار بده:


.itemsContainer {
background:red;
float:left;
position:relative
}
.itemsContainer:hover .play{display:block}
.play{
position : absolute;
display:none;
top:20%;
width:40px;
margin:0 auto; left:0px;
right:0px;
z-index:100
}

نتیجه نهایی/دمو:


http://jsfiddle.net/twfJh/2/

منبع:


http://stackoverflow.com/questions/14889028/show-play-icon-on-image-hover

ویرایش شده در توسط sajjadnajafi

به اشتراک گذاری این پست


لینک به پست

برای ارسال نظر یک حساب کاربری ایجاد کنید یا وارد حساب خود شوید

برای اینکه بتوانید نظر ارسال کنید نیاز دارید که کاربر سایت شوید

ایجاد یک حساب کاربری

برای حساب کاربری جدید در انجمن ما ثبت نام کنید. عضویت خیلی ساده است !


ثبت نام یک حساب کاربری جدید

ورود به حساب کاربری

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


ورود به حساب کاربری