ساخت جعبه آخرین مطالب

alisafari · آذر 92

با سلام خدمت اساتید وردپرس

دوستان برای طراحی قالب یک سایت به جای اسلایدر باید کاری مثل تصویر زیر انجام بدم ، یعنی عکس آخرین مطلب هر دسته رو نشون بدهد و وقتی موس بر روی عکس می رود تیتر اون مطلب رو نشان بدهد.

ممنون میشم اگه راهنماییم کنید

عکس :

**Parsa** · آذر 92

برای ساخت کویری

http://wp-parsi.com/generator/

افکت

http://jsfiddle.net/NuWna/2/

alisafari · آذر 92

ممنون ، ولی میشه یه توضیح کاملتری بدید که چطوری از این دو سایت استفاده کنم

با تشکر

alireza.nh · آذر 92

ممنون ، ولی میشه یه توضیح کاملتری بدید که چطوری از این دو سایت استفاده کنم
با تشکر

لینک اول جهت ساخت کوئری های مطالب هستند که سبب نمایش پست ها خواهند شد!

و لینک دوم افکتی جهت عکس های مطالب شبیه به چیزی که خواستید.

الان دیگه همه چی آمادست ، فقط خلاقیت و تجربه شما رو میطلبه!

ویرایش شده آذر 92 توسط alireza.nh

alisafari · آذر 92

ممنون

ولی از لینک دوم چجوری استفاده کنم

Farzad · آذر 92

کد های نمونه رو باید با باکس های خودتون مچ کنید

کد نمونه زیر باید در فایل js فراخوانی بشه


$(document).ready(function(){

    $(".slide").hover(function(){
	    $(this).find("div.snipit").slideDown("slow");
    },function(){
	    $(this).find("div.snipit").slideUp("slow");   
    });


});

کد css هم به همین صورت فراخوانی بشه


img{
    border:1px solid yellow;  
    margin: 14px 0 0 0;
}
div.slide {
    width: 310px;
    height: 230px;
    float: left;
    border:1px solid red;
    text-align: center;
    position: relative;
    background: url(http://dummyimage.com/310x230) no-repeat top center;
}
div.slide div {
    width: 250px;
    height: 100px;
    padding: 0;
    display: none;
    position: absolute;
    bottom: 0px;
    background-color: rgba(0, 0, 0, 0.5);
    border:1px solid red;
    bottom: 14px;
    left:30px;
}

و HTML


<body>
<div class="slide">
    <img src="http://dummyimage.com/250x200" alt="1" width="250" height="200" />
    <div class="snipit">
		 <h4>Image 1</h4>
		 <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt.</p>
    </div>
</div>
</body>

alisafari · آذر 92

خیلی خیلی ممنون

ورود

ساخت جعبه آخرین مطالب

پست های پیشنهاد شده

alisafari 12

لینک به ارسال

Parsa 23463

لینک به ارسال

alisafari 12

لینک به ارسال

alireza.nh 318

لینک به ارسال

alisafari 12

لینک به ارسال

Farzad 3805

لینک به ارسال

alisafari 12

لینک به ارسال

لطفا برای ارسال دیدگاه وارد شوید

فهرست بخش ها

فعالیت ها