jQuery отзывчивый ползунок ползунка для изменения текста

Question

У меня есть тема Wordpress премиум-класса, которая поставляется со встроенным полнофункциональным слайдером. Он прекрасно интегрируется в мой веб-сайт, но отображает полную страницу, а информация снижается. Ползунок реагирует на размер окна, я бы хотел, чтобы он составлял всего 60%. Пожалуйста, можете помочь:

(function ($) { 
"use strict"; 
$.fn.maximage = function (settings, helperSettings) { 

var config; 

if (typeof settings == 'object' || settings === undefined) config = $.extend($.fn.maximage.defaults, settings || {}); 
if (typeof settings == 'string') config = $.fn.maximage.defaults; 

/*jslint browser: true*/ 
$.Body = $('body'); 
$.Window = $(window); 
$.Scroll = $('html, body'); 
$.Events = { 
    RESIZE: 'resize' 
}; 

this.each(function() { 
    var $self = $(this), 
    preload_count = 0, 
    imageCache = []; 

    /* --------------------- */ 

    // @Modern 

    /* 
    MODERN BROWSER NOTES: 
    Modern browsers have CSS3 background-size option so we setup the DOM to be the following structure for cycle plugin: 
    div = cycle 
    div = slide with background-size:cover 
    div = slide with background-size:cover 
    etc. 
    */ 

    var Modern = { 
    setup: function(){ 
     if($.Slides.length > 0){ 
     // Setup images 
     for(var i in $.Slides) { 
      // Set our image 
      var $img = $.Slides[i]; 

      // Create a div with a background image so we can use CSS3's position cover (for modern browsers) 
      $self.append('<div class="mc-image ' + $img.theclass + '" title="' + $img.alt + '" style="background-image:url(\'' + $img.url + '\');' + $img.style + '" data-href="'+ $img.datahref +'">'+ $img.content +'</div>'); 
     } 

     // Begin our preload process (increments itself after load) 
     Modern.preload(0); 

     // If using Cycle, this resets the height and width of each div to always fill the window; otherwise can be done with CSS 
     Modern.resize(); 
     } 
    }, 
    preload: function(n){ 
     // Preload all of the images but never show them, just use their completion so we know that they are done 
     //  and so that the browser can cache them/fade them in smoothly 

     // Create new image object 
     var $img = $('<img/>'); 
     $img.load(function() { 
     // Once the first image has completed loading, start the slideshow, etc. 
     if(preload_count==0) { 
      // Only start cycle after first image has loaded 
      Cycle.setup(); 

      // Run user defined onFirstImageLoaded() function 
      config.onFirstImageLoaded(); 
     } 

     // preload_count starts with 0, $.Slides.length starts with 1 
     if(preload_count==($.Slides.length-1)) { 
      // If we have just loaded the final image, run the user defined function onImagesLoaded() 
      config.onImagesLoaded($self); 
     }else{ 
      // Increment the counter 
      preload_count++; 

      // Load the next image 
      Modern.preload(preload_count); 
     } 
     }); 

     // Set the src... this triggers begin of load 
     $img[0].src = $.Slides[n].url; 

     // Push to external array to avoid cleanup by aggressive garbage collectors 
     imageCache.push($img[0]); 
    }, 
    resize: function(){ 
     // Cycle sets the height of each slide so when we resize our browser window this becomes a problem. 
     // - the cycle option 'slideResize' has to be set to false otherwise it will trump our resize 
     $.Window 
     .bind($.Events.RESIZE, 
     function(){ 
      // Remove scrollbars so we can take propper measurements 
      $.Scroll.addClass('mc-hide-scrolls'); 

      // Set vars so we don't have to constantly check it 
      $.Window 
      .data('h', Utils.sizes().h) 
      .data('w', Utils.sizes().w); 

      // Set container and slides height and width to match the window size 
      $self 
      .height($.Window.data('h')).width($.Window.data('w')) 
      .children() 
      .height($.Window.data('h')).width($.Window.data('w')); 

      // This is special noise for cycle (cycle has separate height and width for each slide) 
      $self.children().each(function(){ 
      this.cycleH = $.Window.data('h'); 
      this.cycleW = $.Window.data('w'); 
      }); 

      // Put the scrollbars back to how they were 
      $($.Scroll).removeClass('mc-hide-scrolls'); 
     }); 
     } 
    } 

Заранее благодарим. James

Answer 1

Как правило, темы настраиваются на панели администратора. Итак, вы должны проверить это, прежде чем менять его вручную.

Если вы не нашли для настройки на панели администратора (и на странице разработчика темы), как вы, возможно, знаете, когда темы реагируют, они используют некоторые фреймворки, такие как bootstrap, foundation, что угодно. И тогда ползунок должен иметь класс css, например «большой-12», его нужно изменить, чтобы изменить его размер, например «большой-8», тогда размер слайдера будет 8/12.

Надеюсь, это поможет вам!