функции в javascript

[zub_samata]

суть проблемы в том что бы создать менюшку которая, при нахождении в первой секции подключалась бы к одному классу css, при нахождении в другой секции к другому классу css

[Danxil]

суть проблемы в том что бы создать менюшку которая, при нахождении в первой секции подключалась бы к одному классу css, при нахождении в другой секции к другому классу css

Сделай так

<div class="section-1">
  <ul class="onepage-pagination">
    <li>
      <a data-index="1" href="#1" [B]class="onepage-pagination__item active"[/B]></a>
    </li>
    <li>
      <a data-index="2" href="#2" class="onepage-pagination__item"></a>
    </li>
  </ul>
</div>

<div class="section-2">
  <ul class="onepage-pagination">
    <li>
      <a data-index="1" href="#1" [B]class="onepage-pagination__item active"[/B]></a>
    </li>
    <li>
      <a data-index="2" href="#2" class="onepage-pagination__item"></a>
    </li>
  </ul>
</div>

.section-1 .onepage-pagination {
  стили
}
.section-1 .onepage-pagination__item {
  стили
}

.section-2 .onepage-pagination {
  стили
}
.section-2 .onepage-pagination__item {
  стили
}

[рони]

zub_samata,
предположим верхняя ссылка примера ниже это меню, предположим есть три класса меняют цвет текста, предположим что нечто чудесным образом меняет цвет меню при клике на пагинатор справа ... жаль что чудеса не бесплатны, но можно спи.... скопировать.
http://learn.javascript.ru/play/JyKv6b

[zub_samata]

разве это чудо?) да и к тому же код никто не просил) мне бы просто указать направление в котором нужно двигаться) просто предыдущие ваши подсказки я не понял )

[рони]

zub_samata,
в самом плагине есть всё что вам нужно это параметр afterMove -- ставьте в эту функцию всё что хотите изменить при смене класса -- на код что я дал выше можно необращать внимания - я там внёс свою функцию которая срабатывает на нажатия элементов пагинатора.
можно взять как образец смены класса -- делайте пример - информации более чем предостаточно - сделайте ужо чего-нибудь - тогда можно будет сказать почему оно у вас неработает )))

[zub_samata]

<script type="text/javascript">
 $(function (){
 $(".main").onepage_scroll(
     {
         afterMove: Function(index){
              index=$("p").attr("data-index");
             if (index=="1")
                 $('#menu').removeClass('on_top');
             else
                 $('#menu').addClass('on_top');
         }
     }
 );

 });
</script>

вот мой код по которому я пытался изменить верхнюю менюшку

<div id="menu" class="on_top">elements of menu</div>

типо менюшка которая должна меняться

<style type="text/css">
body {
	margin:0;
	padding:0;
}

#menu {
	height: 30px; 
	width:300px;
	border: 1px solid #666;
	-moz-border-radius: 0 0 5px 5px;
	-webkit-border-radius: 0 0 5px 5px;
	border-radius: 0 0 5px 5px;
	background: #999;
	margin: 0px 50px;
	position:fixed;	

	filter:progid:DXImageTransform.Microsoft.Alpha(opacity=50); /* IE 5.5+*/
	-moz-opacity: 0.5; /* Mozilla 1.6 и ниже */
	-khtml-opacity: 0.5; /* Konqueror 3.1, Safari 1.1 */
	opacity: 0.5; /* CSS3 - Mozilla 1.7b +, Firefox 0.9 +, Safari 1.2+, Opera 9+ */
}

#menu:hover, #menu.on_top {
	filter:progid:DXImageTransform.Microsoft.Alpha(opacity=100); /* IE 5.5+*/
	-moz-opacity: 1; /* Mozilla 1.6 и ниже */
	-khtml-opacity: 1; /* Konqueror 3.1, Safari 1.1 */
	opacity: 1; /* CSS3 - Mozilla 1.7b +, Firefox 0.9 +, Safari 1.2+, Opera 9+ */
}

#content {
	border: 1px solid #F00;
	height:5000px;
	padding: 40px;

}
</style>

код css который я пытаюсь подключить или отключить при определенных условиях

спасибо за Ваше терпение )

[рони]

zub_samata,
зачем нужна строка 6 ? и Function с f

[zub_samata]

в строке 6 я пытался вытащить data-index действующей секции
но вы знаете кажется я начинаю по немного понимать а чем вы хотели сказать мне в начале
вот мой новый код основанный на вашем старом
я только заменил paginationClick на beforeMove )

<script>
 $(document).ready(function () {
        var cls = ["yellow", "red", "green"];
        $(".main").onepage_scroll({
           sectionContainer: "section",
            loop: true,
            responsiveFallback: 600,
             beforeMove: function(i) {
                 $(".menu").removeClass(cls.join(" ")).addClass(cls[i])

             }

        })
    });
  </script>

все работает одна проблема при прокрутке в обратном порядке он выдает не то что нужно. ну тоесть не то что было

[рони]

zub_samata,
так у вас должно быть

$(document).ready(function(){
      $(".main").onepage_scroll({
        sectionContainer: "section",
        responsiveFallback: 600,
        loop: true,
        afterMove: function(index){
               if (index=="1")
                 $('#menu').removeClass('on_top');
             else
                 $('#menu').addClass('on_top');
         }
      });
		});

afterMove: function(index) здесь индекс куда пришли
beforeMove: function(i) здесь индекс откуда хотим уйти
индексы в плагине с 1 а не с нуля

[zub_samata]

а как он в таком случае будет определять что index секции равен 1 или 2 или 3?
и еще один вопрос а как объеденить paginationClick и afterMove ?) просто если вот так то все ломается )

<script>
 $(document).ready(function () {
        var cls = ["yellow", "red", "green"];
        $(".main").onepage_scroll({
           sectionContainer: "section",
            loop: true,
            responsiveFallback: 600,
             beforeMove: function(i) {
                 $(".menu").removeClass(cls.join(" ")).addClass(cls[i])

             }

paginationClick: function(i){
                 $(".menu").removeClass(cls.join(" ")).addClass(cls[i])

             }
        })

        
        
    });
  </script>