Результаты поиска
Введите запрос, по завершению нажмите Enter.
ФорумБлогиМануалыНовые постыЛюди
  • Страница 1 из 2
  • 1
  • 2
  • »
Архив - только для чтения
Форум » Прочее » Корзина » Установка слайдера
Установка слайдера
Отправлено 28.10.2011 - 16:051
Нет аватара
Beginner
49 сообщений
Мужчина
Решил установить слайдер.Именно этот (_http://nicolahibbert.com/demo/liteAccordion).

Quote
<link rel="stylesheet" href="liteAccordion.css">

Поставил перед </nead>
Quote
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>
<script src="liteaccordion.jquery.js"></script>

Это перед </body>.
ХТМЛ часть поставил перед $Контент$, а вот дальше ступор.
Куда именно ставить оставшееся.Вроде правильно делаю, но не работает.
Профиль Личное сообщение Дом. страница icq Skype
0
Отправлено 28.10.2011 - 16:062
uSite Team
1689 сообщений
Мужчина
после данных действий в нужное место ставим
Code
<div class="accordion">
     <ol>
         <li>
             <h2><span>Slide One</span></h2>
             <div></div>
         </li>
         <li>
             <h2><span>Slide Two</span></h2>
             <div></div>
         </li>
         <li>
             <h2><span>Slide Three</span></h2>
             <div></div>
         </li>
         <li>
             <h2><span>Slide Four</span></h2>
             <div></div>
         </li>
         <li>
             <h2><span>Slide Five</span></h2>
             <div></div>
         </li>
     </ol>
     <noscript>
         <p>Please enable JavaScript to get the full experience.</p>
     </noscript>
</div>
<script>
     $('#yourdiv').liteAccordion();
</script>
Профиль Личное сообщение Дом. страница icq Skype
709
Отправлено 28.10.2011 - 17:093
Нет аватара
Beginner
49 сообщений
Мужчина
PhoEn-X
Quote (benetton)
ХТМЛ часть поставил перед $Контент$, а вот дальше ступор.

Добавлено (28.10.2011, 17:09)
---------------------------------------------
Я не знаю куда ставить:

Quote
3. Call the plugin
?
1
2
3

<script>
$('#yourdiv').liteAccordion();
</script>

Quote
These are the default settings for the liteAccordion plugin:
?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17

containerWidth : 960, // width of accordion (px)
containerHeight : 320, // height of accordion (px)
headerWidth : 48, // width of tabs (px)

firstSlide : 1, // number of the first active slide (integer)
onActivate : function() {}, // callback function triggered on tab click/mouseover (function)
slideSpeed : 800, // speed of slide animation (time/ms)
slideCallback : function() {}, // callback function triggered after slide animation is complete (function)

autoPlay : false, // automatically scroll through the slides, if true with pause on user click (boolean)
pauseOnHover : false, // *NEW in 1.1* - pause slides on hover
cycleSpeed : 6000, // time between slide activation (time/ms)

theme : 'basic', // which theme to use ('basic', 'light'*, 'dark', or 'stitch'*)
rounded : false, // whether to use rounded corners or not** (boolean)
enumerateSlides : false // show slide number in tab

(* coming soon, **doesn't work in IE)

Simply pass options into the liteAccordion function with an object literal, for example, below is the code for the accordion at the top of the page.
?
1
2
3
4
5
6
7
8
9
10
11
12
13

$('#one').liteAccordion({
onActivate : function() {
this.find('figcaption').fadeOut();
},
slideCallback : function() {
this.find('figcaption').fadeIn();
},
autoPlay : true,
pauseOnHover : true,
theme : 'dark',
rounded : true,
enumerateSlides : true
}).find('figcaption:first').show();

Note: the context for the two callback functions is the (jQuery wrapped) slide div (adjacent to the tab trigger).
Профиль Личное сообщение Дом. страница icq Skype
0
Отправлено 28.10.2011 - 18:284
Нет аватара
Бывалый
330 сообщений
Мужчина
PhoEn-X уже дал тебе код который нужно установить, ниже идут настройки плагина

Добавлено (28.10.2011, 18:28)
---------------------------------------------
ты архив с js и css закинул в ФТП?
Профиль Личное сообщение Дом. страница icq Skype
47
Отправлено 28.10.2011 - 18:365
Нет аватара
Beginner
49 сообщений
Мужчина
Quote (MAGDAN)
PhoEn-X уже дал тебе код который нужно установить, ниже идут настройки плагина

Добавлено (28.10.2011, 18:28)
---------------------------------------------
ты архив с js и css закинул в ФТП?

Конечно.
Перед настройкой еще есть 2 кода
Quote

<script>
$('#yourdiv').liteAccordion();
</script>

и
Quote
$('#one').liteAccordion({
onActivate : function() {
this.find('figcaption').fadeOut();
},
slideCallback : function() {
this.find('figcaption').fadeIn();
},
autoPlay : true,
pauseOnHover : true,
theme : 'dark',
rounded : true,
enumerateSlides : true
}).find('figcaption:first').show();

Куда их вставлять?
Профиль Личное сообщение Дом. страница icq Skype
0
Отправлено 28.10.2011 - 18:406
Нет аватара
Бывалый
330 сообщений
Мужчина
<script>;
$('#one').liteAccordion({
onActivate : function() {
this.find('figcaption').fadeOut();
},
slideCallback : function() {
this.find('figcaption').fadeIn();
},
autoPlay : true,
pauseOnHover : true,
theme : 'dark',
rounded : true,
enumerateSlides : true
}).find('figcaption:first').show();
</script>
Вставь после ХТМЛ части, которую ты уже поставил перед $Контент$,
Профиль Личное сообщение Дом. страница icq Skype
47
Отправлено 28.10.2011 - 18:437
Нет аватара
Beginner
49 сообщений
Мужчина
MAGDAN вот, всё что отображается.
http://img-life.ru/upload_image/5a207f372f6b51d9b71d55d71057e26b.png
Профиль Личное сообщение Дом. страница icq Skype
0
Отправлено 28.10.2011 - 18:468
uSite Team
1689 сообщений
Мужчина
уффф... ну во первых... заливаешь все свои файлы, правильно указываешь путь к ним, далее проверяешь все ли установил, после этого ставишь код из второго сообщения. Сохраняем - радуемся. Что трудного?
И не забываем поправить
Code
<link rel="stylesheet" href="liteAccordion.css">
на
Code
<link type="text/css" rel="StyleSheet" href="/liteAccordion.css" />
заметь что перед именем файла показано, что файл не находится ни в какой папке. Если бы было /css/liteAccordion.css то файл должен лежать по такому адресу http://site.ucoz.ru/css/liteAccordion.css
Профиль Личное сообщение Дом. страница icq Skype
709
Отправлено 28.10.2011 - 18:479
Нет аватара
Beginner
49 сообщений
Мужчина
PhoEn-X все ссылки только что проверил.
Профиль Личное сообщение Дом. страница icq Skype
0
Отправлено 28.10.2011 - 18:4910
uSite Team
1689 сообщений
Мужчина
Сообщение свое дополнил - читай внимательнее
Профиль Личное сообщение Дом. страница icq Skype
709
Отправлено 28.10.2011 - 18:5011
Нет аватара
Beginner
49 сообщений
Мужчина
PhoEn-X файлы лежат в корне.
Quote
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>$SITE_NAME$ - $MODULE_NAME$</title>
<link type="text/css" rel="StyleSheet" href="/_st/my.css" />
<link rel="stylesheet" href="/liteAccordion.css">
</head>

<body id="body">
$GLOBAL_AHEADER$
<!-- <middle> -->
<div id="side_right">
<div id="sider_left">
<!--VIEWN_START-->
$GLOBAL_CONTBLOCK$
<!-- <body> -->
<div class="accordion">
<ol>
<li>
<h2><span>Slide One</span></h2>
<div></div>
</li>
<li>
<h2><span>Slide Two</span></h2>
<div></div>
</li>
<li>
<h2><span>Slide Three</span></h2>
<div></div>
</li>
<li>
<h2><span>Slide Four</span></h2>
<div></div>
</li>
<li>
<h2><span>Slide Five</span></h2>
<div></div>
</li>
</ol>
<noscript>
<p>Please enable JavaScript to get the full experience.</p>
</noscript>
</div>
<script>;
$('#one').liteAccordion({
onActivate : function() {
this.find('figcaption').fadeOut();
},
slideCallback : function() {
this.find('figcaption').fadeIn();
},
autoPlay : true,
pauseOnHover : true,
theme : 'dark',
rounded : true,
enumerateSlides : true
}).find('figcaption:first').show();
</script>
$CONTENT$
$RCODE_1$<!--c1aa1--> <!-- </body> -->
<div class="cTags">$MYINF_3$</div>
</div><!--/sider_left-->
<div id="sider_right">
$GLOBAL_CLEFTER$
</div><!--/sider_right-->
</div><!--/side_right-->
<div id="side_left">
$GLOBAL_DRIGHTER$
</div><!--/side_left-->
<!-- </middle> -->
$GLOBAL_BFOOTER$
<!-- Before the closing body tag --> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>
<script src="/liteaccordion.jquery.js"></script>

</body>
</html>

Вот уже код страницы...
Профиль Личное сообщение Дом. страница icq Skype
0
Отправлено 28.10.2011 - 18:5012
uSite Team
1689 сообщений
Мужчина
То же самое с файлами скриптов
Профиль Личное сообщение Дом. страница icq Skype
709
Отправлено 28.10.2011 - 18:5113
Нет аватара
Beginner
49 сообщений
Мужчина
PhoEn-X гляньте может свежим взглядом.
Code
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>$SITE_NAME$ - $MODULE_NAME$</title>
<link type="text/css" rel="StyleSheet" href="/_st/my.css" />
  <link rel="stylesheet" href="/liteAccordion.css">
</head>

<body id="body">
$GLOBAL_AHEADER$
<!-- <middle> -->
  <div id="side_right">
  <div id="sider_left">
  <!--VIEWN_START-->
  $GLOBAL_CONTBLOCK$
  <!-- <body> -->
  <div class="accordion">
  <ol>
  <li>
  <h2><span>Slide One</span></h2>
  <div></div>
  </li>
  <li>
  <h2><span>Slide Two</span></h2>
  <div></div>
  </li>
  <li>
  <h2><span>Slide Three</span></h2>
  <div></div>
  </li>
  <li>
  <h2><span>Slide Four</span></h2>
  <div></div>
  </li>
  <li>
  <h2><span>Slide Five</span></h2>
  <div></div>
  </li>
  </ol>
  <noscript>
  <p>Please enable JavaScript to get the full experience.</p>
  </noscript>
</div>
  <script>;
  $('#one').liteAccordion({
  onActivate : function() {
  this.find('figcaption').fadeOut();
  },
  slideCallback : function() {
  this.find('figcaption').fadeIn();
  },
  autoPlay : true,
  pauseOnHover : true,
  theme : 'dark',
  rounded : true,
  enumerateSlides : true
  }).find('figcaption:first').show();
  </script>
  $CONTENT$
  $RCODE_1$<!--c1aa1--> <!-- </body> -->
  <div class="cTags">$MYINF_3$</div>
  </div><!--/sider_left-->
  <div id="sider_right">
  $GLOBAL_CLEFTER$
  </div><!--/sider_right-->
  </div><!--/side_right-->
  <div id="side_left">
  $GLOBAL_DRIGHTER$
  </div><!--/side_left-->
<!-- </middle> -->
$GLOBAL_BFOOTER$
  <!-- Before the closing body tag --> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>
  <script src="/liteaccordion.jquery.js"></script>
   
</body>
</html>
Профиль Личное сообщение Дом. страница icq Skype
0
Отправлено 28.10.2011 - 18:5414
uSite Team
1689 сообщений
Мужчина
Лучше адрес сайта дайте. По моему тут нет ошибок.
Профиль Личное сообщение Дом. страница icq Skype
709
Отправлено 28.10.2011 - 18:5615
Нет аватара
Beginner
49 сообщений
Мужчина
PhoEn-X _http://chelsea-live.com/index/fd/0-250
Адресс страницы, на которой пытаюсь поставить.
Профиль Личное сообщение Дом. страница icq Skype
0
Отправлено 28.10.2011 - 19:0516
uSite Team
1689 сообщений
Мужчина
Попробовал у себя на сайте поставить - не робит.
Профиль Личное сообщение Дом. страница icq Skype
709
Отправлено 28.10.2011 - 19:1517
Нет аватара
Beginner
49 сообщений
Мужчина
Quote (PhoEn-X)
Попробовал у себя на сайте поставить - не робит.

Ясненько...
Профиль Личное сообщение Дом. страница icq Skype
0
Отправлено 28.10.2011 - 19:1618
Нет аватара
Бывалый
330 сообщений
Мужчина
1. NOD ругается на троянец в твоем мини-чате
2. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>
<script src="/liteaccordion.jquery.js"></script>
Нужно ставить сразу после <body> а не вконце страницы
Профиль Личное сообщение Дом. страница icq Skype
47
Отправлено 28.10.2011 - 19:2119
uSite Team
1689 сообщений
Мужчина
Все, разобрался.
между
Code
<head></head>
ставим
Code
<link rel="stylesheet" href="/liteaccordion.css" />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>
<script src="/liteaccordion.jquery.js"></script>


Ставим туда, где хотим видеть слайдер.
Code
<div id="one" class="accordion">
  <ol>
   <li>
    <h2><span>Slide One</span></h2>
    <div></div>
   </li>
   <li>
    <h2><span>Slide Two</span></h2>
    <div></div>
   </li>
   <li>
    <h2><span>Slide Three</span></h2>
    <div></div>
   </li>
   <li>
    <h2><span>Slide Four</span></h2>
    <div></div>
   </li>
   <li>
    <h2><span>Slide Five</span></h2>
    <div></div>
   </li>
  </ol>
<noscript><p>Please enable JavaScript to get the full experience.</p></noscript>
</div>
<script>
$('#one').liteAccordion({
     onActivate : function() {this.find('figcaption').fadeOut();},
     slideCallback : function() {this.find('figcaption').fadeIn();},
     autoPlay : true, // Авто перелистывание. true - перелистывать, false - не перелистывать
     firstSlide : 3, // Изначально открытый слайд
     pauseOnHover : true, // Остановка авто перелистывания при наведении курсора
     theme : 'dark', // Шаблон оформления, есть варианты dark, basic, light ну и stitch
     slideSpeed : 800, // Скорость перелистывания, сейчас стоит 0.8сек
     cycleSpeed : 6000, // Через 6сек слайд сменится, если включено авто перелистывание
     rounded : true, // Закругление уголков у обводки
     enumerateSlides : true, // Закругление уголков у кнопок
     containerWidth : 960, // Ширина слайдера
     containerHeight : 320, // Высота слайдера
     headerWidth : 48 // Ширина кнопок
}).find('figcaption:first').show();
</script>
Профиль Личное сообщение Дом. страница icq Skype
709
Отправлено 28.10.2011 - 19:2820
Нет аватара
Beginner
49 сообщений
Мужчина
PhoEn-X делаю как ты написал, но тоже самое...
Можно ссылку, где ты поставил слайдер?
Профиль Личное сообщение Дом. страница icq Skype
0
Отправлено 28.10.2011 - 19:2921
Нет аватара
Бывалый
330 сообщений
Мужчина
епт я только что тоже устанавливал и все получилось)

Добавлено (28.10.2011, 19:29)
---------------------------------------------
Только правильней будет
<script>
$('#one').liteAccordion({
onActivate : function() {this.find('figcaption').fadeOut();},
slideCallback : function() {this.find('figcaption').fadeIn();},
autoPlay : true, // Авто перелистывание. true - перелистывать, false - не перелистывать
firstSlide : 3, // Изначально открытый слайд
pauseOnHover : true, // Остановка авто перелистывания при наведении курсора
theme : 'dark', // Шаблон оформления, есть варианты dark, basic, light ну и stitch
slideSpeed : 800, // Скорость перелистывания, сейчас стоит 0.8сек
cycleSpeed : 6000, // Через 6сек слайд сменится, если включено авто перелистывание
rounded : true, // Закругление уголков у обводки
enumerateSlides : true, // Закругление уголков у кнопок
containerWidth : 960, // Ширина слайдера
containerHeight : 320, // Высота слайдера
headerWidth : 48 // Ширина кнопок
}).find('figcaption:first').show();
</script>

установить в <head> или сразу после body
Профиль Личное сообщение Дом. страница icq Skype
47
Отправлено 28.10.2011 - 19:3022
Нет аватара
Beginner
49 сообщений
Мужчина
MAGDAN можно ссылку?
Профиль Личное сообщение Дом. страница icq Skype
0
Отправлено 28.10.2011 - 19:3123
Нет аватара
Бывалый
330 сообщений
Мужчина
я устанавливал в html файл
Профиль Личное сообщение Дом. страница icq Skype
47
Отправлено 28.10.2011 - 19:3224
Нет аватара
Beginner
49 сообщений
Мужчина
PhoEn-X можете дать ссылку?
Профиль Личное сообщение Дом. страница icq Skype
0
Отправлено 28.10.2011 - 19:3825
Нет аватара
Бывалый
330 сообщений
Мужчина
Замени свою страницу:
Code
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>$SITE_NAME$ - $MODULE_NAME$</title>
<link type="text/css" rel="StyleSheet" href="/_st/my.css" />
<link rel="stylesheet" href="/liteaccordion.css" />
  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>
  <script src="/liteaccordion.jquery.js"></script>
<script>
  $('#one').liteAccordion({
      onActivate : function() {this.find('figcaption').fadeOut();},
      slideCallback : function() {this.find('figcaption').fadeIn();},
      autoPlay : true, // Авто перелистывание. true - перелистывать, false - не перелистывать
      firstSlide : 3, // Изначально открытый слайд
      pauseOnHover : true, // Остановка авто перелистывания при наведении курсора
      theme : 'dark', // Шаблон оформления, есть варианты dark, basic, light ну и stitch
      slideSpeed : 800, // Скорость перелистывания, сейчас стоит 0.8сек
      cycleSpeed : 6000, // Через 6сек слайд сменится, если включено авто перелистывание
      rounded : true, // Закругление уголков у обводки
      enumerateSlides : true, // Закругление уголков у кнопок
      containerWidth : 960, // Ширина слайдера
      containerHeight : 320, // Высота слайдера
      headerWidth : 48 // Ширина кнопок
  }).find('figcaption:first').show();
  </script>
</head>

<body id="body">
$GLOBAL_AHEADER$
<!-- <middle> -->
<div id="side_right">
<div id="sider_left">
<!--VIEWN_START-->
$GLOBAL_CONTBLOCK$
<!-- <body> -->
  <ol>
     <li>
         <h2 class="" style="width: 320px; height: 48px; left: 0px;"><span>Slide One</span><b>1</b></h2>
         <div style="width: 720px; left: 0px; padding-left: 48px;">
       <figure>
        <img src="http://nicolahibbert.com/demo/liteAccordion/img-demo/1.jpg" alt="image">
        <figcaption style="display: block;">I can haz big caek?</figcaption>
       </figure>
      </div>
     </li>
     <li>
         <h2 class="" style="width: 320px; height: 48px; left: 48px;"><span>Slide Two</span><b>2</b></h2>
         <div style="width: 720px; left: 48px; padding-left: 48px;">
       <figure>
        <img src="http://nicolahibbert.com/demo/liteAccordion/img-demo/2.jpg" alt="image">
        <figcaption style="display: block;">Whoops.</figcaption>
       </figure>
      </div>
     </li>
     <li>
         <h2 class="" style="width: 320px; height: 48px; left: 96px;"><span>Slide Three</span><b>3</b></h2>
         <div style="width: 720px; left: 96px; padding-left: 48px;">
       <figure>
        <img src="http://nicolahibbert.com/demo/liteAccordion/img-demo/3.jpg" alt="image">
        <figcaption style="display: block;">Some caption text goes in here...</figcaption>
       </figure>
      </div>
     </li>
     <li>
         <h2 class="selected" style="width: 320px; height: 48px; left: 144px;"><span>Slide Four</span><b>4</b></h2>
         <div style="width: 720px; left: 144px; padding-left: 48px;">
       <figure>
        <img src="http://nicolahibbert.com/demo/liteAccordion/img-demo/4.jpg" alt="image" width="768">
        <figcaption style="display: block;">Pew pew pew!</figcaption>
       </figure>
      </div>
     </li>
     <li>
         <h2 class="" style="width: 320px; height: 48px; left: 912px;"><span>Slide Five</span><b>5</b></h2>
         <div style="width: 720px; left: 912px; padding-left: 48px;">
       <figure>
        <img src="http://nicolahibbert.com/demo/liteAccordion/img-demo/5.jpg" alt="image">
        <figcaption style="display: block;">More caption text here!</figcaption>
       </figure>
      </div>
     </li>
       </ol>
$CONTENT$
$RCODE_1$
<!-- </body> -->
<div class="cTags">$MYINF_3$</div>
</div><!--/sider_left-->
<div id="sider_right">
$GLOBAL_CLEFTER$
</div><!--/sider_right-->
</div><!--/side_right-->
<div id="side_left">
$GLOBAL_DRIGHTER$
</div><!--/side_left-->
<!-- </middle> -->
$GLOBAL_BFOOTER$
</body>
</html>
Профиль Личное сообщение Дом. страница icq Skype
47
Форум » Прочее » Корзина » Установка слайдера
  • Страница 1 из 2
  • 1
  • 2
  • »
Поиск:
uSite.su © 2010-2025
Все права защищены.
Многогранность и сверхспособности сообщества uCoz заставляют задуматься даже самые стойкие умы веб-программирования, ведь лишь uSite способен предоставить ответы на самые сложные вопросы uCoz.
01RSS
Хостинг от uCozПользовательское соглашение и прочая информация