Poorya.sh

درخواست افکت آمدن لوگو وسط عکس با استفاه از CSS

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

سلام دوستان خوبید بنده یک کد Cssمیخوام که به این کد که در حال حاضر ازش استفاده میکنم اضافه کنم و بعد از بردن ماوس روی عکس پست های سایت بجز این افکت ها که الان اجرا میشه یک لوگوی کوچیچک از سایت هم وسط عکس نمایشه داده بشه من این افکت توی خیلی از سایت ها دیدم اگه بتونید کمک کنید و کد افکتش بدید ممنون میشم

این هم کد فعلی من


.news-item img,#post img {
-webkit-transition: all 0.8s ease-in;
-moz-transition: all 0.8s ease-in;
-o-transition: all 0.8s ease-in;
transition: all 0.8s ease-in;
}
.news-item img:hover,#post img:hover{
border-radius:27px;
box-shadow:0px 0px 0px #9c9c9c;
position:relative;
opacity:.777;
}
.Effect:hover {-webkit-transition: all 0.8s ease-in;-moz-transition: all 0.8s ease-in;-o-transition: all 0.8s ease-in;transition: all 0.8s ease-in;opacity:0;}

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


لینک به پست

آقا من سرچ کردم چند مدل پیدا کردم بعدش که دانلود کردم وقتی اجرا میکنم داخل خود مرورگر اجرا میشن وکدی ندارن باید چجوری از اونا استفاده کنم

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


لینک به پست
آقا من سرچ کردم چند مدل پیدا کردم بعدش که دانلود کردم وقتی اجرا میکنم داخل خود مرورگر اجرا میشن وکدی ندارن باید چجوری از اونا استفاده کنم

یعنی چی کدی ندارن!؟!؟ :blink:

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


لینک به پست

روی نام فایل دانلود شده راست کلیک کنید و open as notepoad

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


لینک به پست

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

کد


.post-thumbnail a:hover .overlay-icon{opacity:0.7;}
.overlay-icon{
background:url(images/pros.png) no-repeat center;
width:100%;
height:100%;
display:block;
position:absolute;
opacity:0;
top:2px;
-webkit-transition: all .4s ease-in-out;
-moz-transition: all .4s ease-in-out;
-o-transition: all .4s ease-in-out;
-ms-transition: all .4s ease-in-out;
transition: all .4s ease-in-out;
}

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


لینک به پست

شکل تصویر در صفحه باید این شکلی باشه


<div class="post-thumbnail">
<a >
<img />
<span class="overlay-icon"> </span>
</a>
</div>

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


لینک به پست

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

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

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

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


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

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

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


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

  • مطالب مشابه

    • توسط amzzm75
      باسلام و احترام قالبی که من استفاده میکنم تعداد زیادی فایل css و javascript داره به طوری که تعداد درخواست ها به سرور منو زیاد کرده به طوری که وقتی با gtmetrix تست میکنم میزنه 150 درخواست به سرور و به فشرده نبودن و تعداد زیاد فایل ها ایراد میگیره من یه بار اومدم با سایتایی که این فایلا رو فشرده میکنن فشردشون کردم اما فونت و ظاهر بعضی قسمت های سایت بهم ریخت و مجبور شدم به حالت قبل برش گردونم موندم چیکار کنم که تعداد فایل ها کم بشه تا سرعت لود سایت بالاتر بره و سایت بهینه بشه لطفا راهنمایی کنین 
      آدرس سایت من:umagazine.ir
    • توسط chemist
      با سلام و عرض خسته نباشید؛
      بنده از این کد CSS در وب سایت استفاده کرده ام؛
      #left-menu i img { max-width:24px; max-height:24px; } در مرورگر کروم موبایل تصاویر در اندازه واقعی عکس ها نمایش داده می شود! (از ماکزیمم طول و عرض تعیین شده تبعیت نمی کند) ولی در مابقی مرورگرها با ابعاد تعیین شده نمایش داده می شود. آیا برای سازگاری کامل با تمامی مرورگرها باید تغییری در کد اعمال کنم؟
      ممنون میشم راهنمایی بفرمائید.
      با تشکر
    • توسط mehr-cs
      سلام
      منمیخوام یه قسمت تحت عنوان تاریخچه داشته باشم به این صورت که، تو یک باکس کوچیک تمامی حروف الفبا رو داشته باشم و لوگوی کل تاریخچه ی برند هام تو صفحه باشه و کاربر بعد از کلیک کردن روی هر کدوم از حروف الفبا، کلیه تاریخچه هایی که با اون حرف شروع میشه رو ببینه !
      دوستان راهنمایی میکنن ؟
    • توسط mihanpsd
      سلام میخوام وقتی موس به سمت محصولات حرکت داده میشه ، عکس hover محصول نمایش داده نشه و حرکت نکنه . همون عکس بصورت ثابت باقی بمونه .
      ممنون میشم راهنمایی کنید .
      http://mashinno.com 
       
    • توسط hosseinrasouli
      سلام به مهندسین.
      من میخواهم منو چند ستونه داشته باشم  و اینکارو با تغییر فایل style.css خود قالب انجام بدم.  (نمی خواهم از افزونه های مگامنو استفاده کنم)
      تغییراتی رو در style.css قالب انجام دادم ولی عملی نشد .
      فایل style.css و تصویر منو سایت پیوست است . ( خواهشمند است دوستان برنامه نویس راهنمایی کنند) style.css