[Help] Slider

[GTI]

Направих слайдер с 5 картинки. Искам под всяка картинка да има фон,за тази цел в един див съм поместил картинка и в него в друг див направих фона на css. проблема е,че фона отива върху картинката.

<div class='num0 img slide'><li> <img src='images/1.png' alt='1' title='1' /></li><div class="div1"></div></div>

.div1{
	position: fixed;
	height: 50vh;
	background-color: #0AA699;
	bottom: 0;
	width: 100%;
	}

Правя го така за да не правя картинка с фон - става прекалено голяма като размер.

 

[misho_rb]

Здравей,

Ако те разбирам правилно, подобен подход трябва да ти свърши работа(вместо снимката съм сложил друг <div>):
Colored footer - JSFiddle

Идеята е, да не ползваш фиксиран елемент, ами блоков елемент, който обхваща цялата дължина на контейнера.

Ако снимката ти няма clear/не се показва като блоков елемент(пример: position: aboslute) пак ще имаш overlap.

Това ще ти свърши работа ако растоянието под снимката ти е фиксирано. Ако се променя, може да сложиш background-a на parent-a '.img.slide', като той ще е под снимката. След това остава да го направиш малко по-дълъг от нея(за да стърчи отдолу).

Ако не се оправиш прати примера и как искаш да стане, ще го нашляпаме това.

 

[Dea7h]

Слагаш див-а с фона след картинката?
Пробвай така
<div class='num0 img slide'><div class="div1"></div><li> <img src='images/1.png' alt='1' title='1' /></li></div>

ако не стане направо сложи фона в 1вия див "num0 img slide"

 

[TwIsTeR]

а защо не ползваш bootstrap ? има си и слайдер и си решаваш проблемите ( хем е и responsive )

 

[misho_rb]

а защо не ползваш bootstrap ? има си и слайдер и си решаваш проблемите ( хем е и responsive )

Ето една причина - защото както всеки grid-based layout е "restrictive-as-shit". Изключително удобен е ако искаш да подкараш нещо бързо и надеждно, но при повечето проекти(поне в комерсиален аспект) на мен ми е по-удобно да го пропусна.

 

[RaFa]

Ето една причина - защото както всеки grid-based layout е "restrictive-as-shit". Изключително удобен е ако искаш да подкараш нещо бързо и надеждно, но при повечето проекти(поне в комерсиален аспект) на мен ми е по-удобно да го пропусна.

Кое му е "restrictive-as-shit" на Bootstrap или на Foundation?

Имаш свободата да пишеш собствен CSS и да използваш само компонентите, които искаш (може да не ползваш grid системата). А на всичкото отгоре ти спестява една седмица (ако сайта е от 2 страници, няма да е една седмица, разбира се) писанe на CSS за responsive.

 

[GTI]

Хора оправих се,мерси все пак за вниманието.