قالب "هاي وب"

[irsa]

با سلام
آيا كسي از دوستان قالبي مشابه قالب "هاي وب" را سراغ دارد؟
دیدن لینک ها برای شما امکان پذیر نیست. لطفا ثبت نام کنید یا وارد حساب خود شوید تا بتوانید لینک ها را ببینید.

روش عملكرد آيتم هاي زير اسلايد شو اهميت دارد


ممنونم، شاد و پيـروز باشيد

[sajjad salehi]

خب اگه منظورت اون دگمه های گرد هست که وقتی موس میره روشون عکسشون عوض میشه . احتمالا یه سری css اختصاصیه که به یک منو اعمال کردن .
شما به کمک module class یک کلاس css رو به ماژول منوتون اختصاص میدین بعد کدها رو به آخر فایل css قالبتون در دو حالات بدون پسوند و در حالت hover اعمال میکنید .
مثلا
sa.circle{
background image:image1
}


sa.circle:hover{
background image:image2
}
در حالت ساده تر 4میشه تا ماژول html سفارشی بسازین که دقیقا همینکار رو انجام بدن .

[sajjad salehi]

نقل قول: قالبی در این شکل و شمایل سراغ ندارید؟
متشکرم

خب متاسفانه قالب شبیه که سراغ ندارم ولی شما خودتون میتونید به راحتی با کمک css ایجاد کنید .
4 تا ماژول html سفارشی درست کنید حله . نمونه های مشابه روی نت فراوونه
دیدن لینک ها برای شما امکان پذیر نیست. لطفا ثبت نام کنید یا وارد حساب خود شوید تا بتوانید لینک ها را ببینید.

دیدن لینک ها برای شما امکان پذیر نیست. لطفا ثبت نام کنید یا وارد حساب خود شوید تا بتوانید لینک ها را ببینید.

دیدن لینک ها برای شما امکان پذیر نیست. لطفا ثبت نام کنید یا وارد حساب خود شوید تا بتوانید لینک ها را ببینید.

دیدن لینک ها برای شما امکان پذیر نیست. لطفا ثبت نام کنید یا وارد حساب خود شوید تا بتوانید لینک ها را ببینید.

این کدیه که های وب استفاده کرده

کد: (انتخاب همه)

.ch-item:hover .ch-info-front {
    -webkit-transform: translate3d(0,200px,0) rotate3d(1,0,0,-90deg);
    -moz-transform: translate3d(0,200px,0) rotate3d(1,0,0,-90deg);
    -o-transform: translate3d(0,200px,0) rotate3d(1,0,0,-90deg);
    -ms-transform: translate3d(0,200px,0) rotate3d(1,0,0,-90deg);
    transform: translate3d(0,200px,0) rotate3d(1,0,0,-90deg);
    opacity: 0;
}

.ch-item:hover .ch-info-back {
    -webkit-transform: rotate3d(1,0,0,0deg);
    -moz-transform: rotate3d(1,0,0,0deg);
    -o-transform: rotate3d(1,0,0,0deg);
    -ms-transform: rotate3d(1,0,0,0deg);
    transform: rotate3d(1,0,0,0deg);
    opacity: 1;
}

عکس اولی ماوس میره روش پاک میشه و عکس دومی موس میره روش ظاهر میشه .
ولی راحت تره یک ایتم داشته باشی در دو حالت hover وغیر هور کدها رو براش تنظیم کنی.