помогите пожалуйста сократить css

[sovsem-nub]

Был слайдер на 5 картинок. я увеличил его до 10 картинок, но на CSS теперь смотреть не могу. Можно как-то сократить записи вида

/* Show the info box when the user selects the slides */
.slider2 input:nth-of-type(1):checked  ~ .slides2 > .tk-museo-sans span:nth-of-type(1) .info, 
.slider2 input:nth-of-type(2):checked  ~ .slides2 > .tk-museo-sans span:nth-of-type(2) .info,  
.slider2 input:nth-of-type(3):checked  ~ .slides2 > .tk-museo-sans span:nth-of-type(3) .info,
.slider2 input:nth-of-type(4):checked  ~ .slides2 > .tk-museo-sans span:nth-of-type(4) .info, 
.slider2 input:nth-of-type(5):checked  ~ .slides2 > .tk-museo-sans span:nth-of-type(5) .info,
.slider2 input:nth-of-type(6):checked  ~ .slides2 > .tk-museo-sans span:nth-of-type(6) .info, 
.slider2 input:nth-of-type(7):checked  ~ .slides2 > .tk-museo-sans span:nth-of-type(7) .info,  
.slider2 input:nth-of-type(8):checked  ~ .slides2 > .tk-museo-sans span:nth-of-type(8) .info,
.slider2 input:nth-of-type(9):checked  ~ .slides2 > .tk-museo-sans span:nth-of-type(9) .info, 
.slider2 input:nth-of-type(10):checked  ~ .slides2 > .tk-museo-sans span:nth-of-type(10) .info 

{
	bottom: 79px;
}

/* .. and finally, move the slides into the correct position when the user clicks the arrow, so the right
   slide is selected */

.slider2 input:nth-of-type(1):checked ~ .slides2 > div > span { left: 5% }
.slider2 input:nth-of-type(2):checked ~ .slides2 > div > span { left: -5% }
.slider2 input:nth-of-type(3):checked ~ .slides2 > div > span { left: -15% }
.slider2 input:nth-of-type(4):checked  ~ .slides2 > div > span { left: -25% }
.slider2 input:nth-of-type(5):checked ~ .slides2 > div > span { left: -35% }
.slider2 input:nth-of-type(6):checked ~ .slides2 > div > span { left: -45% }
.slider2 input:nth-of-type(7):checked ~ .slides2 > div > span { left: -55% }
.slider2 input:nth-of-type(8):checked ~ .slides2 > div > span { left: -65% }
.slider2 input:nth-of-type(9):checked ~ .slides2 > div > span { left: -75% }
.slider2 input:nth-of-type(10):checked ~ .slides2 > div > span { left: -85% }

Там много подобного, но никак не пойму как такое можно сократить и сделать слайдер на бесконечное количество картинок.

[ksa]

Без тестового примера трудно судить...
Но вот это все похоже одинаковое

.slider2 input:nth-of-type(1):checked  ~ .slides2 > .tk-museo-sans span:nth-of-type(1) .info, 
.slider2 input:nth-of-type(2):checked  ~ .slides2 > .tk-museo-sans span:nth-of-type(2) .info,  
.slider2 input:nth-of-type(3):checked  ~ .slides2 > .tk-museo-sans span:nth-of-type(3) .info,
.slider2 input:nth-of-type(4):checked  ~ .slides2 > .tk-museo-sans span:nth-of-type(4) .info, 
.slider2 input:nth-of-type(5):checked  ~ .slides2 > .tk-museo-sans span:nth-of-type(5) .info,
.slider2 input:nth-of-type(6):checked  ~ .slides2 > .tk-museo-sans span:nth-of-type(6) .info, 
.slider2 input:nth-of-type(7):checked  ~ .slides2 > .tk-museo-sans span:nth-of-type(7) .info,  
.slider2 input:nth-of-type(8):checked  ~ .slides2 > .tk-museo-sans span:nth-of-type(8) .info,
.slider2 input:nth-of-type(9):checked  ~ .slides2 > .tk-museo-sans span:nth-of-type(9) .info, 
.slider2 input:nth-of-type(10):checked  ~ .slides2 > .tk-museo-sans span:nth-of-type(10) .info {
	bottom: 79px;
}

И его можно попробовать заменить на

.slider2 input:checked  ~ .slides2 > .tk-museo-sans span.info{
	bottom: 79px;
}

А это все разное.
Без тестового примера что-то другое не предложить...

.slider2 input:nth-of-type(1):checked ~ .slides2 > div > span { left: 5% }
.slider2 input:nth-of-type(2):checked ~ .slides2 > div > span { left: -5% }
.slider2 input:nth-of-type(3):checked ~ .slides2 > div > span { left: -15% }
.slider2 input:nth-of-type(4):checked  ~ .slides2 > div > span { left: -25% }
.slider2 input:nth-of-type(5):checked ~ .slides2 > div > span { left: -35% }
.slider2 input:nth-of-type(6):checked ~ .slides2 > div > span { left: -45% }
.slider2 input:nth-of-type(7):checked ~ .slides2 > div > span { left: -55% }
.slider2 input:nth-of-type(8):checked ~ .slides2 > div > span { left: -65% }
.slider2 input:nth-of-type(9):checked ~ .slides2 > div > span { left: -75% }
.slider2 input:nth-of-type(10):checked ~ .slides2 > div > span { left: -85% }

[sovsem-nub]

вот сам слайдер на 5 картинок http://heeg.ru/test/heeg_testls9.html#slider22

он работает на чистом CSS (без js)

сам CSS находится здесь http://heeg.ru/test/heeg_testls9.htm...eSheetTo pic4

CSS можно менять прямо на сайте и вид слайдера будет меняться. Ваша замена сработала. Но если куски с процентами нельзя заменить, значит не получится сделать слайдер на бесконечное количество фото?

вот такой кусок ТЕОРИТИЧЕСКИ можно заменить на бесконечный?

/* The next bit is a bit wordy, but it just positions the slides at either side of the selected slide 
   so we get a cool 3D effect */
.slider2 input:nth-of-type(1):checked ~ .slides2 > .tk-museo-sans span:nth-of-type(2) ,
.slider2 input:nth-of-type(2):checked ~ .slides2 > .tk-museo-sans span:nth-of-type(3) ,
.slider2 input:nth-of-type(3):checked ~ .slides2 > .tk-museo-sans span:nth-of-type(4) ,
.slider2 input:nth-of-type(4):checked ~ .slides2 > .tk-museo-sans span:nth-of-type(5)  {
	-webkit-transform: rotateY(-10deg) scale(0.8) translateX(-10%);
	transform: rotateY(-10deg) scale(0.8) translateX(-10%);
	z-index: 0;
}

или это невозможно?

[ksa]

Но если куски с процентами нельзя заменить, значит не получится сделать слайдер на бесконечное количество фото?

Получается так...

[sovsem-nub]

Получается так...

Обидно. Даже первый кусок не получилось сократить. Только сейчас заметил что после замены куска на

.slider2 input:checked  ~ .slides2 > .tk-museo-sans span.info{
    bottom: 79px;
}

все нижние подписи пропадают

[warren buffet]

10:3 Глупый являет глупость свою даже просто идя по дороге, и каждый видит, что он глуп.

10:15 Труд изнуряет глупого настолько, что путь обратный в город он найти не может. Труд для него тяжёл всю жизнь.

10:10 Но мудрость облегчает работу. Трудно рубить тупым топором, и если его не наточишь, то тебе понадобится больше сил. Точно так же и мудрость.

Екклезиаст.

[sovsem-nub]

10:3

Екклезиаст.

Посты набиваем? Пиши погоду на завтра. Пусть тоже не в тему но толку будет больше. Екклезиаст

[warren buffet]

sovsem-nub, ты все еще забиваешь персональный left на каждую картинку? Тогда Зигмунд Фрейд купит твою душу по дешевке. )))

Это же анальная фиксация у тебя. https://sites.google.com/site/tohabi...icnosti/stadii