rel19 said: The parallax background images are not resizing to smaller size on mobile devices - What is the best image size for BG images?
If You want to set background-size to 'cover' or 'contain' - then You'll have resize effect according to browser size, but also You'll make parallax effect impossible if this image is a single image with no-repeat parameter. So if You use single image as background and You want to have parallax effect - the image has to be big, taller then content block.
rel19 said: Also how do I make the font size smaller of the header titles on mobile devices?
When browser's width is below 480px all headings are of 80% of their oryginal size. But as I see You've placed in Custom Styles some strong definitions of heading's font-size (with '!important' parameter) - that's why headings are not shinking. If You want to define different font-size for each heading, please go to Chillout Options >> Layout >> Headings.
Remember to rate our theme if you like it All the Best.
I disabled parallax on the first background image - on mobile devices the resizing is still not really working... the first background image is larger than the whole page (covering the complete screen on mobile) How do I fix this?
Also the top header logo is really jerky on mobile devices ( constantly going up and down when scrolling) How do I disable (make invisible) the top header logo on mobile devices?
rel19 said: I disabled parallax on the first background image - on mobile devices the resizing is still not really working... the first background image is larger than the whole page (covering the complete screen on mobile) How do I fix this?
Yes, parallax is disabled, but You have 'Cover background with image?' checked. If You need some custom styles for this content block - give a new class name to it and define css for this class in Chillout Options >> Custom Style. Also there's 300px padding set fot top and bottom of fisrt content block.
rel19 said: Also the top header logo is really jerky on mobile devices ( constantly going up and down when scrolling) How do I disable (make invisible) the top header logo on mobile devices?
Go to Chillout Options >> Custom Style and paste this definitions:
@media only screen and (max-width: 460px) { .logo_img1{display: none;} }
You can set another screen width (instead of 460px) below which this image will be hidden.
Remember to rate our theme if you like it All the Best.
Comments
So if You use single image as background and You want to have parallax effect - the image has to be big, taller then content block.
When browser's width is below 480px all headings are of 80% of their oryginal size. But as I see You've placed in Custom Styles some strong definitions of heading's font-size (with '!important' parameter) - that's why headings are not shinking.
If You want to define different font-size for each heading, please go to Chillout Options >> Layout >> Headings.
All the Best.
I disabled parallax on the first background image - on mobile devices the resizing is still not really working... the first background image is larger than the whole page (covering the complete screen on mobile) How do I fix this?
Also the top header logo is really jerky on mobile devices ( constantly going up and down when scrolling) How do I disable (make invisible) the top header logo on mobile devices?
New URL: formatc-live.com
Cheers!
Could you please let me know how to fix this.
New URL: formatc-live.com
Thanks.
If You need some custom styles for this content block - give a new class name to it and define css for this class in Chillout Options >> Custom Style.
Also there's 300px padding set fot top and bottom of fisrt content block.
Go to Chillout Options >> Custom Style and paste this definitions: You can set another screen width (instead of 460px) below which this image will be hidden.
All the Best.
I added the following code to the Custom Style:
@media only screen and (max-width: 460px) {
.logo_img1{display: none;}
}
However the top header logo is still showing on mobile devices.
All the Best.