하는 CSS 스타일을 적용 BX-슬라이더 요소

Question

내 사이트 JQuery와 효과 BX-슬라이더 Bx-Slider Page에 적용했지만 지금은 이전과 다음 내 CSS를 화살표에 적용됩니다. 나는 이미지를 적용했지만 CSS 적법성을 적용 할 수도 있습니다.

var defaults = { 
     mode: 'horizontal',         // 'horizontal', 'vertical', 'fade' 
     infiniteLoop: true,         // true, false - display first slide after last 
     hideControlOnEnd: false,      // true, false - if true, will hide 'next' control on last slide and 'prev' control on first 
     controls: true,           // true, false - previous and next controls 
     speed: 700,             // integer - in ms, duration of time slide transitions will occupy 
     easing: 'swing',     // used with jquery.easing.1.3.js - see http://gsgd.co.uk/sandbox/jquery/easing/ for available options 
     pager: false,            // true/false - display a pager 
     pagerSelector: null,        // jQuery selector - element to contain the pager. ex: '#pager' 
     pagerType: 'full',         // 'full', 'short' - if 'full' pager displays 1,2,3... if 'short' pager displays 1/4 
     pagerLocation: 'bottom',      // 'bottom', 'top' - location of pager 
     pagerShortSeparator: '/',      // string - ex: 'of' pager would display 1 of 4 
     pagerActiveClass: 'pager-active',  // string - classname attached to the active pager link 
     nextText: '',          // string - text displayed for 'next' control 
     nextImage: 'images/right_arrow.png',           // string - filepath of image used for 'next' control. ex: 'images/next.jpg' 
     nextSelector: null,         // jQuery selector - element to contain the next control. ex: '#next' 
     prevText: '',          // string - text displayed for 'previous' control 
     prevImage: 'images/left_arrow.png',           // string - filepath of image used for 'previous' control. ex: 'images/prev.jpg' 
     prevSelector: null,         // jQuery selector - element to contain the previous control. ex: '#next' 
     captions: false,          // true, false - display image captions (reads the image 'title' tag) 
     captionsSelector: null,       // jQuery selector - element to contain the captions. ex: '#captions' 
     auto: false,            // true, false - make slideshow change automatically 
     autoDirection: 'next',       // 'next', 'prev' - direction in which auto show will traverse 
     autoControls: false,        // true, false - show 'start' and 'stop' controls for auto show 
     autoControlsSelector: null,     // jQuery selector - element to contain the auto controls. ex: '#auto-controls' 
     autoStart: true,          // true, false - if false show will wait for 'start' control to activate 
     autoHover: false,          // true, false - if true show will pause on mouseover 
     autoDelay: 0,      // integer - in ms, the amount of time before starting the auto show 
     pause: 3000,            // integer - in ms, the duration between each slide transition 
     startText: 'start',         // string - text displayed for 'start' control 
     startImage: '',           // string - filepath of image used for 'start' control. ex: 'images/start.jpg' 
     stopText: 'stop',          // string - text displayed for 'stop' control 
     stopImage: '',           // string - filepath of image used for 'stop' control. ex: 'images/stop.jpg' 
     ticker: false,   

당신이 읽을 수있는 것처럼, 당신이 제어 할 다음/이전 선택을 설정해야하지만이 선택을 설정할 때 내 컨트롤 vanished.why : 여기 는 jquery.bxslide.js 코드의 조각이다?

Answer 1

슬라이더가있는 페이지에서 jQuery에 사용할 요소를 입력해야합니다. 귀하의 슬라이더가있는 경우

그래서 index.html을 해당 페이지를 열고 다음 코드

<script src="http://code.jquery.com/jquery-latest.js" type="text/javascript"></script> 
<script src="jquery.bxSlider.min.js" type="text/javascript"></script> 
<script type="text/javascript"> 

$(function(){ 
    $('#slider1').bxSlider({ 
    }); 
}); 

을 찾아이 내 원하는 요소를 넣어. 그래서 다음에 대한 귀하의 화살표 이미지를 추가하고 있었던 나는 또한 'prevText'와 nextText을 추가하고 그렇지 않으면 빈 이미지와 나를 위해 텍스트 쇼 모두 왼쪽

  <script src="http://code.jquery.com/jquery-latest.js" type="text/javascript"></script> 
      <script src="jquery.bxSlider.min.js" type="text/javascript"></script> 
      <script type="text/javascript"> 

$(function(){ 
    $('#slider1').bxSlider({ 
    nextImage: 'url of image goes here', 
    prevImage: 'url of image goes here', 
    prevText: '', 
    nextText: '', 
    }); 
}); 

것 이전합니다. ThreeTwo