want to make the revolution slider's height dynamic based on jQuery(window).height()

冷暖自知 提交于 2019-12-11 05:13:18

问题


well am developing site called http://promomakerz.com/new i wanna change the revolution slider's height it depends on the

jQuery(window).height -jQuery('.navbar').height();

so i used made my jquery hacks to do so with this code

        jQuery(window).on('load resize',function(){
            var height_left = jQuery(window).height()-jQuery('.navbar').height();
            jQuery('#rev_Slider').css({height:height_left+'px'});
            jQuery('#rev_slider_1_1').css({height:height_left+'px'});
            jQuery('#rev_slider_1_1_wrapper').css({height:height_left+'px'});
            console.log("Slider Changed Successfully");
        });

and it did work but it reverse itself to the height written in the admin panel

guys am trying to fix this issue 2 days ago and its still on please help


回答1:


oh my god !!!! thank god i've found the solution using the API its little bit tricky but it worked super fine <3

solution :-

var api = revapi1; // the one refers to the slider id 
var height_left = jQuery(window).height()-jQuery('.navbar').height();
var sliderSettings = api.data('opt') || api[0].opt;
console.log(sliderSettings); // here u can see slider revapi1's settings
sliderSettings.height = height_left;
sliderSettings.conh = height_left;
sliderSettings.ulh = height_left;
sliderSettings.gridheight[0] = height_left;



回答2:


Perfect thank you but I had to use a timeout for that it worked well

function resizeSlider() {
    var api = revapi1;
     var windowHeight = $(window).height();
     var height_left = windowHeight -  $('header.site-header').height() - $('#uid_581031dff187267690e9823b9a5b565a').height();  
     var sliderSettings = api.data('opt') || api[0].opt;
     //console.log(sliderSettings);
     setTimeout(function() {
        sliderSettings.height = height_left;
        sliderSettings.conh = height_left;
        sliderSettings.ulh = height_left;
        sliderSettings.gridheight[0] = height_left;
    },250);
}
$(window).resize(function(){
    resizeSlider();     
});
resizeSlider();



回答3:


The official offset-option could also work:

jQuery('#rev_slider_1').show().revolution({

    sliderLayout: 'auto',

    /* OFFSET SLIDER BY THE HEIGHT OF AN ELEMENT */
    fullScreenOffsetContainer: ".navbar",

    /* options continued .... */


来源:https://stackoverflow.com/questions/46840441/want-to-make-the-revolution-sliders-height-dynamic-based-on-jquerywindow-heig

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!