not a support question
fitzpatrick512
Member
I'm finding the fullscreen backgrounds to be problematic for mobile phones.
2 main issues:
1. once the user scrolls down in android or iphone, the background doesn't scroll with the content, and the site looks weird or unfinished
2. the background images are taking too long to load for mobile users.
So I'm looking into a way to disable the background slideshow for mobile users. I'll post here if I can figure something out!
Hi fitzpatrick51,
I'm going to flag this thread for the rest of support team to see if they have any suggestions to offer.
Regards,
Mya
fitzpatrick512
Member
We could use this script to detect if the user is part of a certain user agent group:
http://code.google.com/p/php-mobile-detect/
The next step would be to disable the full screen slider for those users.
Ismael
Moderator
Hello,
You can use media queries. This link might help.
http://webdesignerwall.com/tutorials/responsive-design-with-css3-media-queries
Just drop a line on your custom.css
@media screen and (max-width: 480px) {
.avia_fullscreen_slider, .background_overlay {
display: none;
}
}If this is working, all users viewing from a mobile device with a width less than 480px will not see any background slider. I hope this helps.
Regards,
Ismael
If you're familiar with jquery coding you could add a mobile check by using the jquery script from here: http://detectmobilebrowsers.com/ - it may require one or two hours of work (with testing, debugging, etc.).
You must log in to post.
Please start by registering an account for this forum here
Create a new thread and tell me what problems you are encountering and what you want to know.
There is no step 3 :)
We try to answer all questions within a day, monday-friday.
