问题
I inherited this site: http://www.thinkiam.com/
It's WordPress using Slider Revolution.
The default full size of the slider & it's images is 1200p. When the screen is smaller than that, the prior slide zooms in just before the next slide loads.
And the only reason the slides initial load at the right size is because I added background-size: cover to them. Without that style, the images are not responding even when they first appear.
You can see that by inspecting and turning this off
@media screen and (max-width: 1200px)
style.css?ver=1.0.0:27
div.tp-bgimg.defaultimg, div.slot {
background-size: cover;
}
What settings in Slider Revolution that will produce a simple responsive slider?
回答1:
in never versions of the revolution slider they figured out responsive or mobile stuff very nicely, so check if you have the latest version
just go in slider settings, click on that you want to have support for mobile and tablet (you can adjust screen sizes as well) and after that when you will edit your slider your will have extra views for mobile and tablet where you can adjust your slider for mobile
her is quite detailed tutorial: https://www.themepunch.com/faq/slider-revolution-responsive-tutorial-5-0/
have fun
回答2:
Finally figured it out. The maddening part was that the images were the right size at all times except when the current slide receded to the background so the next slide could come in over top of it. When that happened, the now-background image became full size and spilled outside the slider viewport. I could style the image when it was on top of the stack, but not when it became the background image.
Turns out each slide in the slider has it's own styles. The "Background Size" option was set to "normal." Setting each slide to the option "contain" allowed the slider to respond to smaller screen sizes.
来源:https://stackoverflow.com/questions/42730487/slider-revolution-in-wordpress-previous-slider-image-zooms-in-before-next-image