Shorhand

Question

나는이 같은 다양한 코드를 가지고 :

  $(function() { 

      $('#slider1').carouFredSel({ 
       auto: false, 
       infinite:false,     
       circular:false, 
       prev:'#prev1', 
       next:'#next1', 
       pagination:"#pager1", 
       mousewheel:true, 
       swipe: { 
        onMouse: true, 
        onTouch: true 
       } 
      }); 

     $('#slider2').carouFredSel({ 
       auto: false, 
       infinite:false,     
       circular:false, 
       prev:'#prev2', 
       next:'#next2', 
       pagination:"#pager2", 
       mousewheel:true, 
       swipe: { 
        onMouse: true, 
        onTouch: true 
       } 
      });   
     }); 

     window.addEvent('domready', function(){
 

    var container = document.id('container'), 
    queuedElems = []; 

    var sorter = new Fx.Sort($$('#container .sort'), { 
    duration: '1000', 
    transition: Fx.Transitions.Back.easeInOut, 
    mode: 'vertical', 
    onComplete: function(){ 
     displayDOM(); 
     } 
    }); 

    displayDOM(); 

    document.id('swap').addEvent('click', function(event){ 
    event.stop(); 
    var elems = container.getChildren(); 
    sorter.swap(elems[0], elems[elems.length - 1]); 
    }); 



    window.addEvent('domready', function(){ 

    var container = document.id('container2'), 
    queuedElems = []; 

    var sorter = new Fx.Sort($$('#container2 .sort'), { 
    duration: '1000', 
    transition: Fx.Transitions.Back.easeInOut, 
    mode: 'vertical', 
    onComplete: function(){ 
     displayDOM(); 
     } 
    }); 

    displayDOM(); 

    document.id('swap2').addEvent('click', function(event){ 
    event.stop(); 
    var elems = container.getChildren(); 
    sorter.swap(elems[0], elems[elems.length - 1]); 
    }); 

각 코드마다 설정이 있기 때문에 내가 그들을 싶습니다

은 '속기'방식으로 기록 될 ID 이름 만 변경됩니다 (ID1, ID2 ...). 나는 자바 스크립트 (CSS에서만)에서 이것을 수행하는 방법을 전혀 모른다. 내가 아는 유일한 것은 'var'태그가 필요하다는 것입니다.

약간의 지식을 가진 사람이라면 누구나 쉽게 할 수 있습니다. 나는 많은 조합을 시도했지만 항상 실패했다. 좋은 예가 될 것입니다. 그거 어렵 니?

Answer 1

당신은이 일을 할 수있는 : 그냥를 할당 ,를 사용하여 ID를 통해 여러 요소를 선택하거나 일반 클래스 (.slider)

$('#slider1, #slider2').carouFredSel({ 
      auto: false, 
      infinite:false,     
      circular:false, 
      prev:'#prev1', 
      next:'#next1', 
      pagination:"#pager1", 
      mousewheel:true, 
      swipe: { 
       onMouse: true, 
       onTouch: true 
      } 
     }); 

을 할당하거나 변수

var mySettings = { 
      auto: false, 
      infinite:false,     
      circular:false, 
      prev:'#prev1', 
      next:'#next1', 
      pagination:"#pager1", 
      mousewheel:true, 
      swipe: { 
       onMouse: true, 
       onTouch: true 
      } 
     }; 
    $('#slider1').carouFredSel(mySettings); 

    $('#slider2').carouFredSel(mySettings); 

Answer 2

에 설정을 저장 모든 요소에 공통 클래스를 추가하고 동시에 모든 플러그인에 대해 플러그인을 한 번 초기화하십시오 (예 : $('#slider1') 대신 $('.slider')).