Вопрос О Слайдерах
#1
Отправлено 15 Февраль 2014 - 16:37
У меня 2 разных слайдера, но нужно удалить нижний и поставить место него тот что стоит в верху
- слайдер который нужно продублировать
- слайдер который удалить
#2
Отправлено 15 Февраль 2014 - 19:53
Candyover (15 Февраль 2014 - 16:37) писал:
У меня 2 разных слайдера, но нужно удалить нижний и поставить место него тот что стоит в верху
часть №1.png - слайдер который нужно продублировать
часть №2.png - слайдер который удалить
<!-- Nyvo слайдер который отображается на главной --> {% IF index_page %} <!-- Обёртка, указывающая стиль темы --> <div class="theme-default" style="padding: 1em; display: none;"> <!-- Непосредственный код слайдера --> <div id="slider"> <img src="http://kelesia.storeland.net/_________________501bed21c66f5.jpg?1832" alt="" /> <a href="/"><img src="http://kelesia.storeland.net/2011-04%20(15)_Mario%20Muzi__1.jpg?1832" alt="" /></a> <img title="Тут вставлю текст" src="http://kelesia.storeland.net/_________________501bed21c66f5.jpg?1832" alt="" /> <img src="http://kelesia.storeland.net/2011-04%20(15)_Mario%20Muzi__1.jpg?1832" alt="" /> <img src="http://storeland.ru/img/faq/questions/nyvo_slider/cars.jpg" alt="" /> </div> </div> <!-- Запуск слайдера --> <script type="text/javascript"> $(window).load(function() { $('#slider').nivoSlider().parent().show(); }); </script> {% ENDIF %}и
!-- Загрузка Jquery галереии Nyvo Slider --> <link rel="stylesheet" href="{ASSETS_STYLES_PATH}nyvo.css" type="text/css" media="screen" /> <script type="text/javascript" src="{ASSETS_JS_PATH}jquery.nivo.slider.pack.js"></script>
#3
Отправлено 16 Февраль 2014 - 01:28
@lina_va (15 Февраль 2014 - 19:53) писал:
<!-- Nyvo слайдер который отображается на главной --> {% IF index_page %} <!-- Обёртка, указывающая стиль темы --> <div class="theme-default" style="padding: 1em; display: none;"> <!-- Непосредственный код слайдера --> <div id="slider"> <img src="http://kelesia.storeland.net/_________________501bed21c66f5.jpg?1832" alt="" /> <a href="/"><img src="http://kelesia.storeland.net/2011-04%20(15)_Mario%20Muzi__1.jpg?1832" alt="" /></a> <img title="Тут вставлю текст" src="http://kelesia.storeland.net/_________________501bed21c66f5.jpg?1832" alt="" /> <img src="http://kelesia.storeland.net/2011-04%20(15)_Mario%20Muzi__1.jpg?1832" alt="" /> <img src="http://storeland.ru/img/faq/questions/nyvo_slider/cars.jpg" alt="" /> </div> </div> <!-- Запуск слайдера --> <script type="text/javascript"> $(window).load(function() { $('#slider').nivoSlider().parent().show(); }); </script> {% ENDIF %}и
!-- Загрузка Jquery галереии Nyvo Slider --> <link rel="stylesheet" href="{ASSETS_STYLES_PATH}nyvo.css" type="text/css" media="screen" /> <script type="text/javascript" src="{ASSETS_JS_PATH}jquery.nivo.slider.pack.js"></script>
Удалил, но теперь нужно добавить слайдер про который я писал в 1 посте
#4
Отправлено 16 Февраль 2014 - 07:32
Candyover (16 Февраль 2014 - 01:28) писал:
В шаблоне HTML найдите данный блок кода:
<div id="slidebackgr"> <div id="slideshow"> <div id="slideshowWindow"> <div class="slide"> <a href="#"> <img src="http://st.magazin-soblazn.ru/2/993/541/k-logo-s.png" height="300" /> </a> </div> <div class="slide"> <a href="#"> <img src="http://st.magazin-soblazn.ru/2/993/540/EXAYF0OPXbo1.png" /> </a> </div> <div class="slide"> <a href="#"> <img src="http://st.magazin-soblazn.ru/2/993/540/EXAYF0OPXbo1.png" /> </a> </div> </div> </div> </div>
Перенесите его на место сразу после данного блока кода:
</table> {% ENDIF %} <!-- end Список товаров на главной --> {% ENDIF %} <!-- END Всевозможные списки товаров --> </td> </tr> </table>
#5
Отправлено 16 Февраль 2014 - 12:43
Alexey11 (16 Февраль 2014 - 07:32) писал:
<div id="slidebackgr"> <div id="slideshow"> <div id="slideshowWindow"> <div class="slide"> <a href="#"> <img src="http://st.magazin-soblazn.ru/2/993/541/k-logo-s.png" height="300" /> </a> </div> <div class="slide"> <a href="#"> <img src="http://st.magazin-soblazn.ru/2/993/540/EXAYF0OPXbo1.png" /> </a> </div> <div class="slide"> <a href="#"> <img src="http://st.magazin-soblazn.ru/2/993/540/EXAYF0OPXbo1.png" /> </a> </div> </div> </div> </div>
Перенесите его на место сразу после данного блока кода:
</table> {% ENDIF %} <!-- end Список товаров на главной --> {% ENDIF %} <!-- END Всевозможные списки товаров --> </td> </tr> </table>
Cкопировал код и перенс, но слайдер не отображается
#6
Отправлено 18 Февраль 2014 - 04:05
<style type="text/css"> #slidebackgr { width:610px; <!---Это можно менять--> height:345px; <!---Это можно менять--> margin-top:10px; <!---Это можно менять--> padding:0; position:relative; background-image: url('http://kelesia.storeland.net/slide_bg1.png?4328'); <!---Это меняем--> } #slideshow #slideshowWindow { width:576px; <!---Это можно менять--> height:320px; <!---Это можно менять--> padding:0; position:relative; margin-left:17px; margin-right:17px; margin-bottom:10px; overflow:hidden; } #slideshow h2 { font-weight: normal; color: #FFFFFF; font-size: 2.1666em; line-height: 1.1538em; margin: 0.7692em 0 0.3846em 0 ; } #slideshow #slideshowWindow .slide { padding:0; width:576px; height:300px; position:relative; margin-top:20px; overflow:hidden; } #slideshow #slideshowWindow .slide .slideText { position:absolute; top:0px; left:0px; width:162px; height:300px; background-repeat:repeat; margin:0; padding:0 10px 0 0; color:#ffffff; font-family:Myriad Pro, Arial, Helvetica, sans-serif; } #slideshow #slideshowWindow .slide .slideText a:link, #slideshow #slideshowWindow .slide .slideText a:visited { color:#ffffff; text-decoration:none; } .slideLink {color:#ffffff; text-decoration:underline; } #slideshow #slideshowWindow .slide .slideText h2, #slideshow #slideshowWindow .slide .slideText p { margin:10px 0 0 10px; padding:0; } /*Navigation*/ .nav { display:block; text-indent:-10000px; position:absolute; cursor:pointer; } #leftNav { top:260px; left:500px; <!---Это можно менять--> width:94px; height:36px; <!---Это можно менять--> background-image: url('http://kelesia.storeland.net/previous.png?4373'); <!---Это меняем--> background-repeat:no-repeat; z-index:999; } #rightNav { top:260px; <!---Это можно менять--> left:550px;<!---Это можно менять--> width:53px; height:36px; background-image: url('http://kelesia.storeland.net/next.png?4362'); <!---Это меняем--> background-repeat:no-repeat; z-index:999; } </style> <script type="text/javascript"> $(document).ready(function() { var currentPosition = 0; var slideWidth = 576; var slides = $('.slide'); var numberOfSlides = slides.length; var slideShowInterval; var speed = 5000; <!---Кажется это скорость прокрутки. Это можно менять--> //Assign a timer, so it will run periodically slideShowInterval = setInterval(changePosition, speed); slides.wrapAll('<div id="slidesHolder"></div>') slides.css({ 'float' : 'left' }); //set #slidesHolder width equal to the total width of all the slides $('#slidesHolder').css('width', slideWidth * numberOfSlides); $('#slideshow') .prepend('<span class="nav" id="leftNav">Move Left</span>') .append('<span class="nav" id="rightNav">Move Right</span>'); manageNav(currentPosition); //tell the buttons what to do when clicked $('.nav').bind('click', function() { //determine new position currentPosition = ($(this).attr('id')=='rightNav') ? currentPosition+1 : currentPosition-1; //hide/show controls manageNav(currentPosition); clearInterval(slideShowInterval); slideShowInterval = setInterval(changePosition, speed); moveSlide(); }); function manageNav(position) { //hide left arrow if position is first slide if(position==0){ $('#leftNav').hide() } else { $('#leftNav').show() } //hide right arrow is slide position is last slide if(position==numberOfSlides-1){ $('#rightNav').hide() } else { $('#rightNav').show() } } //changePosition: this is called when the slide is moved by the timer and NOT when the next or previous buttons are clicked function changePosition() { if(currentPosition == numberOfSlides - 1) { currentPosition = 0; manageNav(currentPosition); } else { currentPosition++; manageNav(currentPosition); } moveSlide(); } //moveSlide: this function moves the slide function moveSlide() { $('#slidesHolder').animate({'marginLeft' : slideWidth*(-currentPosition)}); } }); </script> <div id="slidebackgr"> <div id="slideshow"> <div id="slideshowWindow"> <div class="slide"> <a href="#"> <img src="http://st.magazin-soblazn.ru/2/993/541/k-logo-s.png" height="300" /> </a> </div> <div class="slide"> <a href="#"> <img src="http://st.magazin-soblazn.ru/2/994/668/Bezymyannyj.png" /> </a> </div> <div class="slide"> <a href="#"> <img src="http://st.magazin-soblazn.ru/1/994/437/EXAYF0OPXbo.png" /> </a> </div> </div> </div> </div>замените на:
<div id="slidebackgr"> <div id="slideshow"> <div id="slideshowWindow"> <div class="slide"> <a href="#"> <img src="http://st.magazin-soblazn.ru/2/993/541/k-logo-s.png" height="300" /> </a> </div> <div class="slide"> <a href="#"> <img src="http://st.magazin-soblazn.ru/2/994/668/Bezymyannyj.png" /> </a> </div> <div class="slide"> <a href="#"> <img src="http://st.magazin-soblazn.ru/1/994/437/EXAYF0OPXbo.png" /> </a> </div> </div> </div> </div>
далее в main.css в самый конец добавьте:
#slidebackgr { width:610px; <!---Это можно менять--> height:345px; <!---Это можно менять--> margin-top:10px; <!---Это можно менять--> padding:0; position:relative; background-image: url('http://kelesia.storeland.net/slide_bg1.png?4328'); <!---Это меняем--> } #slideshow #slideshowWindow { width:576px; <!---Это можно менять--> height:320px; <!---Это можно менять--> padding:0; position:relative; margin-left:17px; margin-right:17px; margin-bottom:10px; overflow:hidden; } #slideshow h2 { font-weight: normal; color: #FFFFFF; font-size: 2.1666em; line-height: 1.1538em; margin: 0.7692em 0 0.3846em 0 ; } #slideshow #slideshowWindow .slide { padding:0; width:576px; height:300px; position:relative; margin-top:20px; overflow:hidden; } #slideshow #slideshowWindow .slide .slideText { position:absolute; top:0px; left:0px; width:162px; height:300px; background-repeat:repeat; margin:0; padding:0 10px 0 0; color:#ffffff; font-family:Myriad Pro, Arial, Helvetica, sans-serif; } #slideshow #slideshowWindow .slide .slideText a:link, #slideshow #slideshowWindow .slide .slideText a:visited { color:#ffffff; text-decoration:none; } .slideLink {color:#ffffff; text-decoration:underline; } #slideshow #slideshowWindow .slide .slideText h2, #slideshow #slideshowWindow .slide .slideText p { margin:10px 0 0 10px; padding:0; } /*Navigation*/ .nav { display:block; text-indent:-10000px; position:absolute; cursor:pointer; } #leftNav { top:260px; left:500px; <!---Это можно менять--> width:94px; height:36px; <!---Это можно менять--> background-image: url('http://kelesia.storeland.net/previous.png?4373'); <!---Это меняем--> background-repeat:no-repeat; z-index:999; } #rightNav { top:260px; <!---Это можно менять--> left:550px;<!---Это можно менять--> width:53px; height:36px; background-image: url('http://kelesia.storeland.net/next.png?4362'); <!---Это меняем--> background-repeat:no-repeat; z-index:999; }
Далее в main.js в самый конец-то добавьте:
$(document).ready(function() { var currentPosition = 0; var slideWidth = 576; var slides = $('.slide'); var numberOfSlides = slides.length; var slideShowInterval; var speed = 5000; <!---Кажется это скорость прокрутки. Это можно менять--> //Assign a timer, so it will run periodically slideShowInterval = setInterval(changePosition, speed); slides.wrapAll('<div id="slidesHolder"></div>') slides.css({ 'float' : 'left' }); //set #slidesHolder width equal to the total width of all the slides $('#slidesHolder').css('width', slideWidth * numberOfSlides); $('#slideshow') .prepend('<span class="nav" id="leftNav">Move Left</span>') .append('<span class="nav" id="rightNav">Move Right</span>'); manageNav(currentPosition); //tell the buttons what to do when clicked $('.nav').bind('click', function() { //determine new position currentPosition = ($(this).attr('id')=='rightNav') ? currentPosition+1 : currentPosition-1; //hide/show controls manageNav(currentPosition); clearInterval(slideShowInterval); slideShowInterval = setInterval(changePosition, speed); moveSlide(); }); function manageNav(position) { //hide left arrow if position is first slide if(position==0){ $('#leftNav').hide() } else { $('#leftNav').show() } //hide right arrow is slide position is last slide if(position==numberOfSlides-1){ $('#rightNav').hide() } else { $('#rightNav').show() } } //changePosition: this is called when the slide is moved by the timer and NOT when the next or previous buttons are clicked function changePosition() { if(currentPosition == numberOfSlides - 1) { currentPosition = 0; manageNav(currentPosition); } else { currentPosition++; manageNav(currentPosition); } moveSlide(); } //moveSlide: this function moves the slide function moveSlide() { $('#slidesHolder').animate({'marginLeft' : slideWidth*(-currentPosition)}); } });
#7
Отправлено 18 Февраль 2014 - 16:01
Vaccina (18 Февраль 2014 - 04:05) писал:
<style type="text/css"> #slidebackgr { width:610px; <!---Это можно менять--> height:345px; <!---Это можно менять--> margin-top:10px; <!---Это можно менять--> padding:0; position:relative; background-image: url('http://kelesia.storeland.net/slide_bg1.png?4328'); <!---Это меняем--> } #slideshow #slideshowWindow { width:576px; <!---Это можно менять--> height:320px; <!---Это можно менять--> padding:0; position:relative; margin-left:17px; margin-right:17px; margin-bottom:10px; overflow:hidden; } #slideshow h2 { font-weight: normal; color: #FFFFFF; font-size: 2.1666em; line-height: 1.1538em; margin: 0.7692em 0 0.3846em 0 ; } #slideshow #slideshowWindow .slide { padding:0; width:576px; height:300px; position:relative; margin-top:20px; overflow:hidden; } #slideshow #slideshowWindow .slide .slideText { position:absolute; top:0px; left:0px; width:162px; height:300px; background-repeat:repeat; margin:0; padding:0 10px 0 0; color:#ffffff; font-family:Myriad Pro, Arial, Helvetica, sans-serif; } #slideshow #slideshowWindow .slide .slideText a:link, #slideshow #slideshowWindow .slide .slideText a:visited { color:#ffffff; text-decoration:none; } .slideLink {color:#ffffff; text-decoration:underline; } #slideshow #slideshowWindow .slide .slideText h2, #slideshow #slideshowWindow .slide .slideText p { margin:10px 0 0 10px; padding:0; } /*Navigation*/ .nav { display:block; text-indent:-10000px; position:absolute; cursor:pointer; } #leftNav { top:260px; left:500px; <!---Это можно менять--> width:94px; height:36px; <!---Это можно менять--> background-image: url('http://kelesia.storeland.net/previous.png?4373'); <!---Это меняем--> background-repeat:no-repeat; z-index:999; } #rightNav { top:260px; <!---Это можно менять--> left:550px;<!---Это можно менять--> width:53px; height:36px; background-image: url('http://kelesia.storeland.net/next.png?4362'); <!---Это меняем--> background-repeat:no-repeat; z-index:999; } </style> <script type="text/javascript"> $(document).ready(function() { var currentPosition = 0; var slideWidth = 576; var slides = $('.slide'); var numberOfSlides = slides.length; var slideShowInterval; var speed = 5000; <!---Кажется это скорость прокрутки. Это можно менять--> //Assign a timer, so it will run periodically slideShowInterval = setInterval(changePosition, speed); slides.wrapAll('<div id="slidesHolder"></div>') slides.css({ 'float' : 'left' }); //set #slidesHolder width equal to the total width of all the slides $('#slidesHolder').css('width', slideWidth * numberOfSlides); $('#slideshow') .prepend('<span class="nav" id="leftNav">Move Left</span>') .append('<span class="nav" id="rightNav">Move Right</span>'); manageNav(currentPosition); //tell the buttons what to do when clicked $('.nav').bind('click', function() { //determine new position currentPosition = ($(this).attr('id')=='rightNav') ? currentPosition+1 : currentPosition-1; //hide/show controls manageNav(currentPosition); clearInterval(slideShowInterval); slideShowInterval = setInterval(changePosition, speed); moveSlide(); }); function manageNav(position) { //hide left arrow if position is first slide if(position==0){ $('#leftNav').hide() } else { $('#leftNav').show() } //hide right arrow is slide position is last slide if(position==numberOfSlides-1){ $('#rightNav').hide() } else { $('#rightNav').show() } } //changePosition: this is called when the slide is moved by the timer and NOT when the next or previous buttons are clicked function changePosition() { if(currentPosition == numberOfSlides - 1) { currentPosition = 0; manageNav(currentPosition); } else { currentPosition++; manageNav(currentPosition); } moveSlide(); } //moveSlide: this function moves the slide function moveSlide() { $('#slidesHolder').animate({'marginLeft' : slideWidth*(-currentPosition)}); } }); </script> <div id="slidebackgr"> <div id="slideshow"> <div id="slideshowWindow"> <div class="slide"> <a href="#"> <img src="http://st.magazin-soblazn.ru/2/993/541/k-logo-s.png" height="300" /> </a> </div> <div class="slide"> <a href="#"> <img src="http://st.magazin-soblazn.ru/2/994/668/Bezymyannyj.png" /> </a> </div> <div class="slide"> <a href="#"> <img src="http://st.magazin-soblazn.ru/1/994/437/EXAYF0OPXbo.png" /> </a> </div> </div> </div> </div>замените на:
<div id="slidebackgr"> <div id="slideshow"> <div id="slideshowWindow"> <div class="slide"> <a href="#"> <img src="http://st.magazin-soblazn.ru/2/993/541/k-logo-s.png" height="300" /> </a> </div> <div class="slide"> <a href="#"> <img src="http://st.magazin-soblazn.ru/2/994/668/Bezymyannyj.png" /> </a> </div> <div class="slide"> <a href="#"> <img src="http://st.magazin-soblazn.ru/1/994/437/EXAYF0OPXbo.png" /> </a> </div> </div> </div> </div>
далее в main.css в самый конец добавьте:
#slidebackgr { width:610px; <!---Это можно менять--> height:345px; <!---Это можно менять--> margin-top:10px; <!---Это можно менять--> padding:0; position:relative; background-image: url('http://kelesia.storeland.net/slide_bg1.png?4328'); <!---Это меняем--> } #slideshow #slideshowWindow { width:576px; <!---Это можно менять--> height:320px; <!---Это можно менять--> padding:0; position:relative; margin-left:17px; margin-right:17px; margin-bottom:10px; overflow:hidden; } #slideshow h2 { font-weight: normal; color: #FFFFFF; font-size: 2.1666em; line-height: 1.1538em; margin: 0.7692em 0 0.3846em 0 ; } #slideshow #slideshowWindow .slide { padding:0; width:576px; height:300px; position:relative; margin-top:20px; overflow:hidden; } #slideshow #slideshowWindow .slide .slideText { position:absolute; top:0px; left:0px; width:162px; height:300px; background-repeat:repeat; margin:0; padding:0 10px 0 0; color:#ffffff; font-family:Myriad Pro, Arial, Helvetica, sans-serif; } #slideshow #slideshowWindow .slide .slideText a:link, #slideshow #slideshowWindow .slide .slideText a:visited { color:#ffffff; text-decoration:none; } .slideLink {color:#ffffff; text-decoration:underline; } #slideshow #slideshowWindow .slide .slideText h2, #slideshow #slideshowWindow .slide .slideText p { margin:10px 0 0 10px; padding:0; } /*Navigation*/ .nav { display:block; text-indent:-10000px; position:absolute; cursor:pointer; } #leftNav { top:260px; left:500px; <!---Это можно менять--> width:94px; height:36px; <!---Это можно менять--> background-image: url('http://kelesia.storeland.net/previous.png?4373'); <!---Это меняем--> background-repeat:no-repeat; z-index:999; } #rightNav { top:260px; <!---Это можно менять--> left:550px;<!---Это можно менять--> width:53px; height:36px; background-image: url('http://kelesia.storeland.net/next.png?4362'); <!---Это меняем--> background-repeat:no-repeat; z-index:999; }
Далее в main.js в самый конец-то добавьте:
$(document).ready(function() { var currentPosition = 0; var slideWidth = 576; var slides = $('.slide'); var numberOfSlides = slides.length; var slideShowInterval; var speed = 5000; <!---Кажется это скорость прокрутки. Это можно менять--> //Assign a timer, so it will run periodically slideShowInterval = setInterval(changePosition, speed); slides.wrapAll('<div id="slidesHolder"></div>') slides.css({ 'float' : 'left' }); //set #slidesHolder width equal to the total width of all the slides $('#slidesHolder').css('width', slideWidth * numberOfSlides); $('#slideshow') .prepend('<span class="nav" id="leftNav">Move Left</span>') .append('<span class="nav" id="rightNav">Move Right</span>'); manageNav(currentPosition); //tell the buttons what to do when clicked $('.nav').bind('click', function() { //determine new position currentPosition = ($(this).attr('id')=='rightNav') ? currentPosition+1 : currentPosition-1; //hide/show controls manageNav(currentPosition); clearInterval(slideShowInterval); slideShowInterval = setInterval(changePosition, speed); moveSlide(); }); function manageNav(position) { //hide left arrow if position is first slide if(position==0){ $('#leftNav').hide() } else { $('#leftNav').show() } //hide right arrow is slide position is last slide if(position==numberOfSlides-1){ $('#rightNav').hide() } else { $('#rightNav').show() } } //changePosition: this is called when the slide is moved by the timer and NOT when the next or previous buttons are clicked function changePosition() { if(currentPosition == numberOfSlides - 1) { currentPosition = 0; manageNav(currentPosition); } else { currentPosition++; manageNav(currentPosition); } moveSlide(); } //moveSlide: this function moves the slide function moveSlide() { $('#slidesHolder').animate({'marginLeft' : slideWidth*(-currentPosition)}); } });
Ничего не изменилось, первый слайдер показывает место 3 картинок 6 (крутит первые три)
А в конце только выделилось место для слайдера, но фотографии не отображает.
И в main.css выдает ошибки
#8
Отправлено 18 Февраль 2014 - 20:05
Candyover (18 Февраль 2014 - 16:01) писал:
Ничего не изменилось, первый слайдер показывает место 3 картинок 6 (крутит первые три)
А в конце только выделилось место для слайдера, но фотографии не отображает.
И в main.css выдает ошибки часть №1.png
данные ошибки в css отображаются из-за того , что в css файлах комментарии пишутся немного подругому, попробуйте изменить структуры <!-- --> на /* */
#10
Отправлено 19 Февраль 2014 - 01:54
Цитата
3 вместо 6ти, проблема скорее в одинаковых слайдерах на одной странице, удалите в данном шаблоне в самом низу дубликат.
#11
Отправлено 21 Февраль 2014 - 23:27
Новинки
Хиты продаж
Интересные предложения
можно ли использовать 1 на эти все 3 категории?
можно ли его после добавить и для сопутки + " с этим товаром смотрят"?
т.е. чтобы "Главная" имела примерно такой вид
Новинки (нажмите чтобы развернуть)
Хиты продаж (нажмите чтобы развернуть)
Интересные предложения (нажмите чтобы развернуть)
ну и чтобы разворачивалось независимо, а не одновременно ВСЁ как в случае с тегом "more"
---
ЗЫ. в идеале надо карусель + свернуть/развернуть группы "Новинки" и т.д.
типа спойлера сделал через Яву остался вопрос по каруселям
+ как ещё названия менять, когда раскрыто надпись заменить на "Скрыть"
ещё нашёл 1 проблему с этим самодельным спойлером
в Гугло-хроме работает, а в IE только 1й, другие нет + развёрнуты изначально... как исправить для всех браузеров?
#12
Отправлено 22 Февраль 2014 - 03:42
#13
Отправлено 22 Февраль 2014 - 10:45
Vaccina (22 Февраль 2014 - 03:42) писал:
на сколько я понимаю, там пример для 1й категории и только для галавной
а вот на это что-нибудь ответьте
Цитата
в Гугло-хроме работает, а в IE только 1й, другие нет + развёрнуты изначально... как исправить для всех браузеров?
#14
Отправлено 22 Февраль 2014 - 11:36
http://forum.storela..._120#entry61722
как убрать границу у всей таблицы?
и можно как-то симпатичней сделать меню вкладок?
#15
Отправлено 22 Февраль 2014 - 12:07
http://nettuts.s3.am...demo/index.html
хотя бы визуально
или как тут
http://www.queness.c...llto/index.html
#16
Отправлено 22 Февраль 2014 - 15:07
Z_Mc (22 Февраль 2014 - 11:36) писал:
http://forum.storela..._120#entry61722
как убрать границу у всей таблицы?
и можно как-то симпатичней сделать меню вкладок?
.ui-tabs-nav.ui-helper-reset.ui-helper-clearfix.ui-widget-header.ui-corner-all { border: 0px; }
Z_Mc (22 Февраль 2014 - 12:07) писал:
http://nettuts.s3.am...demo/index.html
хотя бы визуально
или как тут
http://www.queness.c...llto/index.html
#primaryContent ul li { background: url(http://design.akku13.ru/square_bullet.gif) no-repeat 0 0.4em; padding-left: 5px; }на
#primaryContent ul li { padding-left: 5px; border: 0px; }
#17
Отправлено 22 Февраль 2014 - 15:42
@lina_va (22 Февраль 2014 - 15:07) писал:
убрать границу общую в таблице, обведено красным (на фотке во вложении)
убрать для всех браузеров, т.к. указав границу=0 в div убралось только для гугл-хрома, в IE осталось
<!-- Всевозможные списки товаров --> {% IF index_page %} <div id="tabs" style="border:0;">
@lina_va (22 Февраль 2014 - 15:07) писал:
а как указано выше нельзя сделать вкладки?
Z_Mc (22 Февраль 2014 - 12:07) писал:
http://nettuts.s3.am...demo/index.html
хотя бы визуально
или как тут
http://www.queness.c...llto/index.html
#18
Отправлено 22 Февраль 2014 - 16:25
Z_Mc (22 Февраль 2014 - 15:42) писал:
убрать для всех браузеров, т.к. указав границу=0 в div убралось только для гугл-хрома, в IE осталось
<!-- Всевозможные списки товаров --> {% IF index_page %} <div id="tabs" style="border:0;">
2й пункт получился, всё ок на 1е время
а как указано выше нельзя сделать вкладки?
#tabs { border: 0px!important; }
#19
Отправлено 22 Февраль 2014 - 20:12
1) убрать серый фон за ними? (не кнопок, а фон на котором уже кнопки)
2) можно ли при клике на вкладку сделать эффект нажатия? т.е. неактивные вкладки с тенью, а активное без тени/нажат/выбран
#20
Отправлено 22 Февраль 2014 - 21:49
Z_Mc (22 Февраль 2014 - 20:12) писал:
1) убрать серый фон за ними? (не кнопок, а фон на котором уже кнопки)
2) можно ли при клике на вкладку сделать эффект нажатия? т.е. неактивные вкладки с тенью, а активное без тени/нажат/выбран
.ui-tabs .ui-tabs-nav { background: none;border-bottom: none; }
2. не совсем поняла. Вам при наведении, нажатии или уже после открытия вкладки нужен эффект?
Количество пользователей, читающих эту тему: 0
0 пользователей, 0 гостей, 0 анонимных