I want uploaded image with slides option https://docs.reduxframework.com/core/fields/slides/ on redux-framework have same height and not let slider image to cover all front page if screen resolution gets above mobile,tablets resolution.
So far i tried to resize image (also set static height)to see also some content below slider image on desktop resolutions 960px and above (i want to see some content below front page slider image on desktop resolutions above 960px),but not to slider image to cover all front page.But when i resize image to see some content below slider image on desktop resolutions 960px and above,then slider images are almost not seen on mobile devices anymore,when it gets 480px and below. Images height is only ok on mobile devices,when slider image covers all front page,but not ok when i resize them to see some content below slider image.
Example:I have now like on this website http://preview.themeforest.net/item/neer-construction-business-wordpress-theme/full_screen_preview/20851072?ref=cirvitis ,when slider image covers all the front page and page content itself are not seen on front page at all,until i scroll down to it,then image height is ok on mobile devices.
But i want like on this website here: https://codex-themes.com/thegem/meta-splash/ header slider image height is ok on front page when it is resized and i see some content below it and have same results on mobile devices view too.
Now i have good results only when slider image covers all front page,then image are seen ok on mobile devices too. But when i resize front page image,then they are almost not seen on mobile devices.
Related
Is there any chance to make an onClick of an item to scroll down to the images gallery within Elementor PRO Gallery using a smartphone( mobile viewport non-responsive)?
Website: Text
I have a clients website using the Revolution Slider plugin. I'm trying to optimise the page for mobile page speed.
Each slide is just a background image. The problem is that the image is 1920x1080 which is the same image used on mobile screens that are 640px wide or less. This makes the page load a larger file image then is needed.
I've tried removing the background image and including 2 versions of the image to the slide on their own layers. One layer only shows for mobile and the other only for desktop but even though it doesn't display both images it still loads them both. The mobile view shows the smaller image but still loads the larger one without using it.
Wordpress creates small, medium, large and thumbnail versions of images uploaded to the media library. I thought the plugin would use these by default for different screen sizes but I can't see how to set this or do it manually.
Is there a way for me to have the smaller image file display for smaller screens without loading the larger image file? If not is there another slider WordPress plugin that can do this?
I want to use an animated gif as my featured image in WordPress (div, theme). I read a lot about the problems using animated gifs in WordPress, so I chose "large/full size" for the gif file and it works fine on a 13" screen. But on mobile devices, it doesn't resize to the smaller screen width. It stays at 1278px width and therefore gets cropped out.
How do I make the animated gif for all devices work so it keeps it's animation and still fits within the screen width?
use css:
img{max-width:100% !important;}
hope it will help.
I'm trying to create a bootstrap gallery with the thumbnail component. I pulled the code directly from getboostrap.
When viewing the page at full size everything looks fine. However, when I resize the screen to make it smaller the images don't adjust to fit inside of the thumbnail box. What I was hoping to do is have an image that adjusts in size based on how wide the thumbnail box is.
Instead the thumbnail box ends up being substantially wider than the image itself, especially on medium sized screens. The images I'm using for my source images are more than large enough to take up the entire space within the thumbnail.
Any ideas?
Thanks
Is an image displaying in a lightbox script (e.g. prettyPhoto, lightbox, thickbox, etc) affected by high pixel ratio devices?
For example, if I had an 800px wide image up in a lightbox, will it be shown at 800 CSS pixels or 800 actual pixels? To probe further, is an image displayed raw in the browser affected in the same way?
If images displayed with lightboxes are affected by retina screens, what's the solution? Simply link to a larger image? (assuming the script auto resizes images to fit in the viewport)
Perhaps someone needs to develop a new jQuery plugin. :)