Как сделать слайдер из баннеров с ссылкой?
vk9846
Вторник, 07 Апреля 2020, 10:34 | Сообщение 1
Здравствуйте, не получается сделать слайдер из баннеров с ссылкой. Скопировал код и стиль с сайта црфкс.рф :
Код
<div class="inner" style="text-align: left; float: none; position: absolute; top: 0px; right: auto; bottom: auto; left: 0px; margin: 0px; width: 4132px; height: 90px; z-index: auto;"> <a href="http://dussh.syktyvdin.ru/" target="_blank" class="one-link"> <div class="text"> <p class="caption">МБУ "Спортивная школа Сыктывдинского района"</p> <p class="link">http://dussh.syktyvdin.ru/</p> </div> <img src="http://xn--j1aleki.xn--p1ai/images/dk363/ULe82975010bce03c33cbeee93aa2a03d1.jpg" alt="d1WimoDQDDc.jpg"> </a><a href="http://sport.rkomi.ru/" target="_blank" class="one-link"> <div class="text"> <p class="caption">Министерство физической культуры и спорта Республики Коми</p> <p class="link">http://sport.rkomi.ru/</p> </div> <img src="http://xn--j1aleki.xn--p1ai/images/dk363/ULd9a707a773f5d6c8e683987cabc9f4b9.jpg" alt="unnamed.jpg"> </a><a href="https://gto.ru" target="_blank" class="one-link"> <div class="text"> <p class="caption">ВФСК "ГТО"</p> <p class="link">https://gto.ru</p> </div> <img src="http://xn--j1aleki.xn--p1ai/images/dk363/UL324a2ac53294394893de6c3b8b7741ce.jpeg" alt="76463_big.jpeg"> </a><a href="http://syktyvdin.ru" target="_blank" class="one-link"> <div class="text"> <p class="caption">Администрация МО МР "Сыктывдинский"</p> <p class="link">http://syktyvdin.ru</p> </div> <img src="http://xn--j1aleki.xn--p1ai/images/dk363/UL9426f919ba3c687b7dcc236445427285.jpg" alt="сыктывдин.jpg"> </a><a href="http://culture.syktyvdin.ru/" target="_blank" class="one-link"> <div class="text"> <p class="caption">Управление культуры АМО МР "Сыктывдинский"</p> <p class="link">http://culture.syktyvdin.ru/</p> </div>
Стиль:
Код
font-family: ubuntu-cond, Tahoma; font-size: 15px; font-weight: normal; line-height: 25px; color: #292929; padding: 40px 0 40px 0; text-align: left; float: none; position: absolute; top: 0px; right: auto; bottom: auto; left: 0px; margin: 0px; width: 4132px; height: 90px; z-index: auto;
В итоге: А должно получится: P.S.: cсылку на свой сайт пока дать не могу, т.к. он открыт только для администратора. Домен, ещё куплен.
Сообщение отредактировал -SAM- - Вторник, 14 Апреля 2020, 08:48
Страна: (RU )
waak
Вторник, 07 Апреля 2020, 11:33 | Сообщение 2
Здравствуйте! во первых нет кода слайдера, во вторых стили не полные
Страна: (RU )
egorkriv05
Вторник, 07 Апреля 2020, 13:04 | Сообщение 3
waak, Я всё скопировал с сайта --- Добавлено (2020-04-07, 13:07) --------------------------------------------- waak,ой,извините, не в ту тему написал.
Сообщение отредактировал -SAM- - Воскресенье, 12 Апреля 2020, 17:31
Страна: (RU )
vk9846
Вторник, 07 Апреля 2020, 13:11 | Сообщение 4
Код
<p class="title"> <span>Ссылки</span> </p> <span class="left" style="display: block;"></span> <div class="caroufredsel_wrapper" style="display: block; text-align: start; float: none; position: relative; inset: auto; z-index: auto; width: 1180px; height: 140px; margin: 0px; overflow: hidden;"><div class="inner" style="text-align: left; float: none; position: absolute; inset: 0px auto auto 0px; margin: 0px; width: 4130px; height: 90px; z-index: auto;"> <a href="http://syktyvdin.ru" target="_blank" class="one-link"> <div class="text"> <p class="caption">Администрация МО МР "Сыктывдинский"</p> <p class="link">http://syktyvdin.ru</p> </div> <img src="http://xn--j1aleki.xn--p1ai/images/dk363/UL9426f919ba3c687b7dcc236445427285.jpg" alt="сыктывдин.jpg"> </a><a href="http://culture.syktyvdin.ru/" target="_blank" class="one-link"> <div class="text"> <p class="caption">Управление культуры АМО МР "Сыктывдинский"</p> <p class="link">http://culture.syktyvdin.ru/</p> </div> </a><a href="http://dussh.syktyvdin.ru/" target="_blank" class="one-link"> <div class="text"> <p class="caption">МБУ "Спортивная школа Сыктывдинского района"</p> <p class="link">http://dussh.syktyvdin.ru/</p> </div> <img src="http://xn--j1aleki.xn--p1ai/images/dk363/ULe82975010bce03c33cbeee93aa2a03d1.jpg" alt="d1WimoDQDDc.jpg"> </a><a href="http://sport.rkomi.ru/" target="_blank" class="one-link"> <div class="text"> <p class="caption">Министерство физической культуры и спорта Республики Коми</p> <p class="link">http://sport.rkomi.ru/</p> </div> <img src="http://xn--j1aleki.xn--p1ai/images/dk363/ULd9a707a773f5d6c8e683987cabc9f4b9.jpg" alt="unnamed.jpg"> </a><a href="https://gto.ru" target="_blank" class="one-link"> <div class="text"> <p class="caption">ВФСК "ГТО"</p> <p class="link">https://gto.ru</p> </div> <img src="http://xn--j1aleki.xn--p1ai/images/dk363/UL324a2ac53294394893de6c3b8b7741ce.jpeg" alt="76463_big.jpeg"> </a></div></div> <span class="right" style="display: block;"></span>
Добавлено (2020-04-07, 13:13)
---------------------------------------------
html body#body.ctrl-index div#root-right div#root-left div#root.xn--j1aleki.xn--p1ai div#logos-gallery
Добавлено (2020-04-07, 13:14) --------------------------------------------- waak,Все что было на сайте, на котором установлен данный слайдер. Вот сайт ---
Сообщение отредактировал -SAM- - Вторник, 14 Апреля 2020, 08:54
Страна: (RU )
waak
Вторник, 07 Апреля 2020, 13:43 | Сообщение 5
а я вам говорю что это не всё
Страна: (RU )
Kosten
Вторник, 07 Апреля 2020, 14:05 | Сообщение 6
vk9846, пользуйтесь плиз code - мне надоедает за вами исправлять.
Страна: (RU )
vk9846
Вторник, 07 Апреля 2020, 14:16 | Сообщение 7
Код
<div id="logos-gallery"> <p class="title"> <span>Ссылки</span> </p> <span class="left" style="display: block;"></span> <div class="caroufredsel_wrapper" style="display: block; text-align: start; float: none; position: relative; inset: auto; z-index: auto; width: 1180px; height: 140px; margin: 0px; overflow: hidden;"><div class="inner" style="text-align: left; float: none; position: absolute; inset: 0px auto auto 0px; margin: 0px; width: 4130px; height: 90px; z-index: auto;"> <a href="http://dussh.syktyvdin.ru/" target="_blank" class="one-link"> <div class="text"> <p class="caption">МБУ "Спортивная школа Сыктывдинского района"</p> <p class="link">http://dussh.syktyvdin.ru/</p> </div> <img src="http://xn--j1aleki.xn--p1ai/images/dk363/ULe82975010bce03c33cbeee93aa2a03d1.jpg" alt="d1WimoDQDDc.jpg"> </a><a href="http://sport.rkomi.ru/" target="_blank" class="one-link"> <div class="text"> <p class="caption">Министерство физической культуры и спорта Республики Коми</p> <p class="link">http://sport.rkomi.ru/</p> </div> <img src="http://xn--j1aleki.xn--p1ai/images/dk363/ULd9a707a773f5d6c8e683987cabc9f4b9.jpg" alt="unnamed.jpg"> </a><a href="https://gto.ru" target="_blank" class="one-link"> <div class="text"> <p class="caption">ВФСК "ГТО"</p> <p class="link">https://gto.ru</p> </div> <img src="http://xn--j1aleki.xn--p1ai/images/dk363/UL324a2ac53294394893de6c3b8b7741ce.jpeg" alt="76463_big.jpeg"> </a><a href="http://syktyvdin.ru" target="_blank" class="one-link"> <div class="text"> <p class="caption">Администрация МО МР "Сыктывдинский"</p> <p class="link">http://syktyvdin.ru</p> </div> <img src="http://xn--j1aleki.xn--p1ai/images/dk363/UL9426f919ba3c687b7dcc236445427285.jpg" alt="сыктывдин.jpg"> </a><a href="http://culture.syktyvdin.ru/" target="_blank" class="one-link"> <div class="text"> <p class="caption">Управление культуры АМО МР "Сыктывдинский"</p> <p class="link">http://culture.syktyvdin.ru/</p> </div> </a></div></div> <span class="right" style="display: block;"></span> </div>
Добавлено (2020-04-07, 14:18)
---------------------------------------------
Сайт, где взят код для слайдера.
---
Сообщение отредактировал -SAM- - Вторник, 14 Апреля 2020, 08:56
Страна: (RU )
waak
Вторник, 07 Апреля 2020, 16:42 | Сообщение 8
Код
<style> .one-link { display: inline-block; background: #FFF; padding:10px; position: relative; height: 80px; float: left; } .text { text-align: right; color: #434343; font-size: 12px; padding-left: 80px; } .caption { margin-bottom: 10px; width: 200px; font-size: 14px; } .link { position: absolute; bottom: 10px; right: 10px; } .one-link img { position: absolute; top: 10px; left: 10px; } </style>
вот стили набросал свои а слайдер если не можете взять от туда то просто возьмите готовый их полно посмотрите в поиске на данном сайте или в яндексе гугле
Страна: (RU )
vk9846
Вторник, 07 Апреля 2020, 17:16 | Сообщение 9
waak, Код
@keyframes slidy { 0% {left: 0%;} 20% {left: 0%;} 25% {left: -100%;} 45% {left: -100%;} 50% {left: -200%;} 70% {left: -200%;} 75% {left: -300%;} 95% {left: -300%;} 100% {left: -400%;} } .slider {overflow: hidden; margin: 0; width: 285px;} .slider figure img {width: 20%; float: left; height: 410px;} .slider figure { position: relative; width: 500%; margin: 0; left: 0; text-align: left; font-size: 0; animation: 30s slidy infinite alternate; } </style>
Добавлено (2020-04-07, 17:17) --------------------------------------------- waak, вот взял самый обычный слайдер.
Добавлено (2020-04-07, 22:14) --------------------------------------------- Помогите пожалуйста!!!
Страна: (RU )
-SAM-
Среда, 08 Апреля 2020, 07:10 | Сообщение 10
Цитата egorkriv05 (
)
waak,ой,извините, не в ту тему написал.
Цитата Kosten (
)
мне надоедает за вами исправлять
Так смысла нет ведь, тема техническая, а всё, что в ней - просто хлам (не представляющий полезности остальным). А то ТС шутник, что правит сайты (сделаны на html), и чужими руками хочет, чтобы за него выполнили работу (тема такая должна была изначально сделана в надлежащем разделе , вот и всё).UPD.: Цитата vk9846 (
)
Здравствуйте, не получается сделать слайдер из баннеров с ссылкой. Пример слайдера на сайте
*** (внизу).
У меня получилось только
это (скопировал код и стиль с сайта где и находится пример рабочего слайдера из баннеров с ссылкой). А должно получится:
такое .
В общем, "помощь" подобного рода оказываю в первый и в последний раз (с вас плюс и отзыв соответственно), файл в прикреплении --->
Помог? Скажи спасибо в виде "+" - вам мелочь, а мне приятно. Бесплатное оказание помощи в ответах на "Вопросы про uCoz".
Сообщение отредактировал -SAM- - Пятница, 15 Мая 2020, 01:17
Страна: (UA )
egorkriv05
Среда, 08 Апреля 2020, 16:24 | Сообщение 11
-SAM-, а как сделать чтобы слайдер менял изображение на новое?Добавлено (2020-04-08, 16:25) --------------------------------------------- Тоже давно искал похожий материал по слайдеру.
Страна: (RU )
-SAM-
Среда, 08 Апреля 2020, 16:45 | Сообщение 12
egorkriv05, здесь тема о другом как бы. Слайдеров в сети хватает. Вот пример .UPD.: Цитата vk9846 ( )
Большое спасибо! На ucoz все работает отлично!
Пожалуйста. Если на uCoz, то там не нужно подключать jquery.js, если что (ибо он и так подключен на уровне системы).
Помог? Скажи спасибо в виде "+" - вам мелочь, а мне приятно. Бесплатное оказание помощи в ответах на "Вопросы про uCoz".
Сообщение отредактировал -SAM- - Среда, 08 Апреля 2020, 19:35
Страна: (UA )
vk9846
Среда, 08 Апреля 2020, 18:04 | Сообщение 13
-SAM-, Большое Вам спасибо за помощь! Дальнейших Вам успехов!
Страна: (RU )