Title: Slider jquery mały problem
Last modified: 2016-08-05

---

# Slider jquery mały problem

 *  Rozwiązano [Arky88](https://pl.wordpress.org/support/users/arky88/)
 * (@arky88)
 * [12 lat temu](https://pl.wordpress.org/support/topic/slider-jquery-maly-problem/)
 * Witajcie,
 * stawiam właśnie stronę opartą o WordPressa i mam malutki problem. Korzystam z
   motywu Vantage i postanowiłem na dole i na górze strony głównej wstawić slidery.
   Na górze zwykły reklamowy (ten działa bez problemu) i drugi na dole przewijający
   loga klientów. Wykorzystałem do tego widget do wstawiania tekstu lub htmla. Górny
   slider działa jak należy. Dolny ma problem.
 * Kod który wklejam (od dolnego slidera) to:
 *     ```
       ,<!-- it works the same with all jquery version from 1.x to 2.x -->
           <script type="text/javascript" src="../js/jquery-1.9.1.min.js"></script>
           <!-- use jssor.slider.mini.js (40KB) or jssor.sliderc.mini.js (32KB, with caption, no slideshow) or jssor.sliders.mini.js (28KB, no caption, no slideshow) instead for release -->
           <!-- jssor.slider.mini.js = jssor.sliderc.mini.js = jssor.sliders.mini.js = (jssor.core.js + jssor.utils.js + jssor.slider.js) -->
           <script type="text/javascript" src="../js/jssor.core.js"></script>
           <script type="text/javascript" src="../js/jssor.utils.js"></script>
           <script type="text/javascript" src="../js/jssor.slider.js"></script>
           <script>
   
               jQuery(document).ready(function ($) {
                   var options = {
                       $AutoPlay: true,
   
                       $PauseOnHover: false,                               //[Optional] Whether to pause when mouse over if a slideshow is auto playing, default value is false
   
                       $ArrowKeyNavigation: false,   			            //Allows arrow key to navigate or not
                       $SlideWidth: 216,                                   //[Optional] Width of every slide in pixels, the default is width of 'slides' container
                       $SlideHeight: 66,                                  //[Optional] Height of every slide in pixels, the default is width of 'slides' container
                       $SlideSpacing: 1, 					                //Space between each slide in pixels
                       $DisplayPieces: 5,                                  //Number of pieces to display (the slideshow would be disabled if the value is set to greater than 1), the default value is 1
                       $ParkingPosition: 1      		 ,                                //The offset position to park slide (this options applys only when slideshow disabled).
   
                       $ArrowNavigatorOptions: {                       //[Optional] Options to specify and enable arrow navigator or not
                           $Class: $JssorArrowNavigator$,              //[Requried] Class to create arrow navigator instance
                           $ChanceToShow: 2,                               //[Required] 0 Never, 1 Mouse Over, 2 Always
                           $AutoCenter: 2,                                 //[Optional] Auto center arrows in parent container, 0 No, 1 Horizontal, 2 Vertical, 3 Both, default value is 0
                           $Steps: 1                                       //[Optional] Steps to go for each navigation request, default value is 1
                       }
                   };
   
                   var jssor_slider1 = new $JssorSlider$("slider1_container", options);
   
                   //responsive code begin
                   //you can remove responsive code if you don't want the slider scales while window resizes
                   function ScaleSlider() {
                       var parentWidth = jssor_slider1.$Elmt.parentNode.clientWidth;
                       if (parentWidth)
                           jssor_slider1.$SetScaleWidth(Math.min(parentWidth, 1080));
                       else
                           window.setTimeout(ScaleSlider, 30);
                   }
   
                   ScaleSlider();
   
                   if (!navigator.userAgent.match(/(iPhone|iPod|iPad|BlackBerry|IEMobile)/)) {
                       $(window).bind('resize', ScaleSlider);
                   }
   
                   //if (navigator.userAgent.match(/(iPhone|iPod|iPad)/)) {
                   //    $(window).bind("orientationchange", ScaleSlider);
                   //}
                   //responsive code end
               });
           </script>
           <!-- Jssor Slider Begin -->
           <!-- You can move inline styles to css file or css block. -->
           <div id="slider1_container" style="position: relative; top: 0px; left: 0px; width: 1080px;
               height: 66px; overflow: hidden;">
               <!-- Slides Container -->
               <div u="slides" style="cursor: move; position: absolute; left: 0px; top: 0px; width: 1080px; height: 66px;
                   overflow: hidden;">
                   <div><img u="image" src="../img/klienci/mono/1.png"  /></div>
       			 <div><img u="image" src="../img/klienci/mono/1.png" /></div>
       			  <div><img u="image" src="../img/klienci/mono/1.png" onmouseover="this.src='../img/klienci/kolor/1k.png';" onmouseout="this.src='../img/klienci/mono/1.png';" /></div>
       			   <div><img u="image" src="../img/klienci/mono/1.png" onmouseover="this.src='../img/klienci/kolor/1k.png';" onmouseout="this.src='../img/klienci/mono/1.png';" /></div>
                   <div><img u="image" src="../img/klienci/mono/2.png" onmouseover="this.src='../img/klienci/kolor/2k.png';" onmouseout="this.src='../img/klienci/mono/2.png';"/></div>
                   <div><img u="image" src="../img/klienci/mono/3.png" onmouseover="this.src='../img/klienci/kolor/3k.png';" onmouseout="this.src='../img/klienci/mono/3.png';"/></div>
                   <div><img u="image" src="../img/klienci/mono/4.png" onmouseover="this.src='../img/klienci/kolor/4k.png';" onmouseout="this.src='../img/klienci/mono/4.png';"/></div>
                   <div><img u="image" src="../img/klienci/mono/5.png" onmouseover="this.src='../img/klienci/kolor/5k.png';" onmouseout="this.src='../img/klienci/mono/5.png';"/></div>
                   <div><img u="image" src="../img/klienci/mono/6.png" onmouseover="this.src='../img/klienci/kolor/6k.png';" onmouseout="this.src='../img/klienci/mono/6.png';"/></div>
                   <div><img u="image" src="../img/klienci/mono/7.png" onmouseover="this.src='../img/klienci/kolor/7k.png';" onmouseout="this.src='../img/klienci/mono/7.png';"/></div>
                   <div><img u="image" src="../img/klienci/mono/8.png" onmouseover="this.src='../img/klienci/kolor/8k.png';" onmouseout="this.src='../img/klienci/mono/8.png';"/></div>
                   <div><img u="image" src="../img/klienci/mono/9.png" onmouseover="this.src='../img/klienci/kolor/9k.png';" onmouseout="this.src='../img/klienci/mono/9.png';"/></div>
                   <div><img u="image" src="../img/klienci/mono/10.png" onmouseover="this.src='../img/klienci/kolor/10k.png';" onmouseout="this.src='../img/klienci/mono/10.png';"/></div>
                   <div><img u="image" src="../img/klienci/mono/11.png" onmouseover="this.src='../img/klienci/kolor/11k.png';" onmouseout="this.src='../img/klienci/mono/11.png';"/></div>
                   <div><img u="image" src="../img/klienci/mono/12.png" onmouseover="this.src='../img/klienci/kolor/12k.png';" onmouseout="this.src='../img/klienci/mono/12.png';"/></div>
                   <div><img u="image" src="../img/klienci/mono/13.png" onmouseover="this.src='../img/klienci/kolor/13k.png';" onmouseout="this.src='../img/klienci/mono/13.png';"/></div>
                   <div><img u="image" src="../img/klienci/mono/14.png" onmouseover="this.src='../img/klienci/kolor/14k.png';" onmouseout="this.src='../img/klienci/mono/14.png';"/></div>
                   <div><img u="image" src="../img/klienci/mono/15.png" onmouseover="this.src='../img/klienci/kolor/15k.png';" onmouseout="this.src='../img/klienci/mono/15.png';"/></div>
                   <div><img u="image" src="../img/klienci/mono/16.png" onmouseover="this.src='../img/klienci/kolor/16k.png';" onmouseout="this.src='../img/klienci/mono/16.png';"/></div>
               </div>
   
           </div>
       ```
   
 * Raczej nie jest to problem z bibliotekami js bo skopiowałem je do katalogu js
   w katalogu głównym. Wybaczcie jeśli problem jest błahy ale jestem w tym początkujący
   i spędziłem już całą noc na szukaniu rozwiązania…
 * Będę wdzięczny za sugeste.
 * Dodam że robiąc zwykłą stronę html z tym sliderem wszystko działa jak należy.
 * Pozdrawiam
    Marcin

Zobacz 1 odpowiedź (z 1 wszystkich)

 *  Twórca wątku [Arky88](https://pl.wordpress.org/support/users/arky88/)
 * (@arky88)
 * [12 lat temu](https://pl.wordpress.org/support/topic/slider-jquery-maly-problem/#post-44220)
 * Rozgryzłem 🙂 trzeba było zmienić nazwę slidera i divów. Do zamknięcia 🙂

Zobacz 1 odpowiedź (z 1 wszystkich)

 Temat ‘Slider jquery mały problem’ jest zamknięty na nowe odpowiedzi.

## Tagi

 * [jquery](https://pl.wordpress.org/support/topic-tag/jquery/)
 * [problem](https://pl.wordpress.org/support/topic-tag/problem/)
 * [slider](https://pl.wordpress.org/support/topic-tag/slider/)

 * W: [Wtyczki](https://pl.wordpress.org/support/forum/wtyczki-i-hacki/)
 * 1 odpowiedź
 * 1 uczestnik
 * Ostatnia odpowiedź od: [Arky88](https://pl.wordpress.org/support/users/arky88/)
 * Ostatnia aktywność: [12 lat temu](https://pl.wordpress.org/support/topic/slider-jquery-maly-problem/#post-44220)
 * Status: rozwiązane

## Tematy

### Najbardziej popularne tematy

### Tematy bez odpowiedzi

### Wątki niezwiązane ze wsparciem

### Rozwiązane wątki

### Nierozwiązane tematy

### Wszystkie tematy