I'm trying to set responsive font-size
for text in revolution slider
jQuery version but I see revolution slider
gives it another font-size
in inline style by itself instead of my specified font sizes in the data-fontsize
attribute for the layer. I Think that it gives another sizes between my specified font size between two viewport sizes.
This is what i've tried:
<section class="slider-container" id="">
<div class="container-fluid">
<div class="row">
<div class="col-12">
<div id="slider" class="rev_slider fullwidthbanner" style="display:none;" data-version="5.4.8.2">
<ul>
<li data-transition="cube-horizontal" data-hideslideonmbile="false" style="">
<img src="pictures/psy13.jpg" alt="psycholoist picture">
<div class="tp-caption rev_group rs-parallaxlevel-1"
data-width="100%"
data-height="full"
data-x="['left','left','center','center']"
data-hoffset="['32','40','0','0']"
data-y="['center','center','center','center']"
data-type="group"
data-responsive_offset="on"
data-frames='[{
"delay":100,
"speed":300,
"frame":"0",
"to":"o:1;",
"ease":"Power3.easeInOut"
},{
"delay":"wait",
"speed":300,
"frame":"999",
"to":"opacity:0;",
"ease":"Power3.easeInOut"
}]'
style="position:relative; z-index:6; "
>
<div class="tp-caption tp-resizeme"
data-type="text"
data-x="['left','left','center','center']" data-hoffset="['0','0','0','0']"
data-y="['center','center','center','center']" data-voffset="['0','0','0','-60']"
data-fontsize='[20,18,17,16]'
data-lineheight="[66,52,52,40]"
data-frames='[{
"delay":"+90",
"speed":1500,
"frame":"0",
"from":"x:[-100%];z:0;rX:0deg;rY:0;rZ:0;sX:1;sY:1;skX:0;skY:0;",
"to":"o:1;",
"mask":"x:0px;y:0px;s:inherit;e:inherit;",
"ease":"Power3.easeInOut"
},{
"delay":"wait",
"speed":300,
"frame":"999",
"to":"opacity:0;",
"ease":"Power3.easeInOut"
}]'
data-responsive_offset="on"
style=" z-index: 9;position: relative; white-space: nowrap; color:white; font-weight:100;"
>
We Solve the problems that is beyond your control
</div>
</div>
<div class="tp-caption tp-resizeme tp-shape tp-shapewrapper"
data-x="[center,center,center,center]" data-hoffset="[0,0,0,0]"
data-y="[center,center,center,center]" data-voffset="[0,0,0,0]"
data-type="shape"
data-height="full"
data-width:"full"
data-whitespace="nowrap"
data-frames='[{
"delay":100,
"speed":1500,
"frame":0,
"from":"opacity:0;",
"to":"o:1;",
"ease":"Power3.easeInOut"
},
{
"delay":"wait",
"speed":300,
"frame":"999",
"to":"opacity:0",
"ease":"Power3.easeInOut"
}]'
style="background:rgba(0,0,0,0.35); width:200vw; position:relative; z-index:1;"
>
</div>
</li>
</ul>
</div>
</div>
</div>
</div>
</section>
$('#slider').show().revolution({
delay:9000,
autoHeight:"off",
sliderLayout: 'fullwidth',
sliderType:'standard',
speed:'400',
responsiveLevels:[1200,992,768,576],
visibilityLevels:[1200,992,768,576],
gridwidth:[1240,1024,778,480],
gridheight:[1000,600,650,600],
parallax: {
type:"mouse",
origo:"slidercenter",
speed:400,
speedbg:0,
speedls:0,
levels:[1,10,15,20,25,30,35,40,45,46,47,48,49,50,51,55],
disable_onmobile:"on"
}
});
Please, How to disable this?
from Setting responsive font size doesn't work in revolution slider jQuery plugin
No comments:
Post a Comment