Javascript-форум - Использование своего nav в Cycle 3.0.3

Javascript-форум (https://javascript.ru/forum/)

- jQuery (https://javascript.ru/forum/jquery/)

- - Использование своего nav в Cycle 3.0.3 (https://javascript.ru/forum/jquery/60823-ispolzovanie-svoego-nav-v-cycle-3-0-3-a.html)

Использование своего nav в Cycle 3.0.3

Есть проблема с плагином Cycle есть Html код слайдера который должен прокручивать SECTION'ы

<div id="slider_detail">
            <div id="nav_details">
              <a href="#" class="detailsIcon i1"></a>
              <a href="#" class="detailsIcon i2"></a>
              <a href="#" class="detailsIcon i3"></a>
            </div>
            <div id="pager">
              <section class="page1">
                <h2>Creative Ideas</h2>
                <p></p>
                <p</p>
              </section>
              <section class="page2">
                <h2>Creative Ideas2</h2>
                <p></p>
                <p></p>
              </section>
              <section class="page3">
                <h2>Creative Ideas3</h2>
                <p></p>
                <p></p>
              </section>
            </div>
          </div>

код слайдера

$(document).ready(function() {
    $('#pager').cycle({
		fx: 'scrollLeft',
		timeout: 00,
		pager: '#nav_details'
	});
});

Проблема в том, что все блоки section получают атрибут(color: rgb(0,0,0,) и он генерирует теги <a>, а не использует мои.

Это можно как нибудь исправить?

Artem_A,
можно сам плагин расковырять, по мне это было бы самым простым решением.
P.s.: сам я с Cycle не работал, так что может есть и более простые способы.

Siend,
Я ковырял и добился только устранения черного фона и генерации тега <a> но он все равно не хочет пользоваться моим nav

Artem_A,
как ты ты этого пытался добиться? делал своему нав другой класс и обращался по этому классу?

Siend,
нет, он и так обращается вроде через pager: "nav_details"
или нет?

Цитата:

Сообщение от Artem_A

Проблема в том, что все блоки section получают атрибут(color: rgb(0,0,0,) и он генерирует теги <a>, а не использует мои.

а вам какая разница? оставили блок '#nav_details' пустым, потом если нужно добавили созданным плагином ссылкам нужные классы или без добавления прописали в css нужное вам оформление #nav_details а {всё что хотите}

Artem_A,

<!DOCTYPE HTML>

<html>

<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">
   .detailsIcon{
     color: #FFFFFF;
     padding: 6px;
     text-decoration: none;
     margin: 5px;
   }
   .detailsIcon:nth-child(1){
      background-color: #FF00FF;
   }
   .detailsIcon:nth-child(2){
      background-color: #00BFFF;
   }
   .detailsIcon:nth-child(3){
      background-color: #FFD700;
   }
   .activeSlide{
     border: 2px solid #FF0000;
      margin: 3px;
   }

  </style>
  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.cycle/3.0.3/jquery.cycle.all.js"></script>
  <script>
     $(function(){

        $('#pager').cycle({
		fx: 'scrollLeft',
		timeout: 0,
	    pager: '#nav_details'
	});
    $('#nav_details a').addClass('detailsIcon')
});


  </script>
</head>

<body>  <div id="slider_detail">
            <div id="nav_details">
            </div>
            <div id="pager">
              <section class="page1">
                <h2>Creative Ideas</h2>
                <p></p>
                <p></p>
              </section>
              <section class="page2">
                <h2>Creative Ideas2</h2>
                <p></p>
                <p></p>
              </section>
              <section class="page3">
                <h2>Creative Ideas3</h2>
                <p></p>
                <p></p>
              </section>
            </div>
          </div>



</body>

</html>

рони,
Он так же цифры генерирует, но это ведь можно в самом плагине убрать?
я менял:

a = '<a href="#">'+(i+1)+'</a>';

,
на:

a = '<a href="#"></a>';

рони,
но блоки все равно получают атрибут color: rgb(0,0,0)

Цитата:

Сообщение от Artem_A

но это ведь можно в самом плагине убрать?

нафига? не проще .text('') дописать в код предложенный выше