True Parallax / Cell Phone Background Size / Responsive Design

Hi Vlad. Fabulous Theme. I selected it from a long list of over 40 themes. I selected it for two reasons;
• Responsive design (works on all screen sizes)
• Parallax in more than one area.
I have just posted my website Jriangle.com, A Realty Design & Multimedia (mostly) site. After a very long time and learning curve it is up and running.
I have just spent the last two days searching the extensive help files here and still can’t find the answers to the two things I’m having the most trouble with. You guessed it. The two reasons I selected this theme.

Responsive Design.
So many are having trouble getting it to work well on smaller screens. I didn’t think I had to test it since it was advertised as responsive so I made the computer browser look right. On iPhones (even my huge Lane Bryant 6Plus Version) all of the animations and widgets on the front page do not scale down small enough and the background images can’t possible seem to fill the background. I guess I can just select a color for the background but certainly wouldn’t show much creativity with such a blah site then.

Ture Parallax.
I can get the parallax to work on computer browser (I have read in several location that it has been disabled since this particular style of coding doesn’t seem to work well with the huge majority of how people access the web now) but it seems to only be a still image that the words scroll up over. I have seen several other websites using your theme that have corrected this problem and added a background image that moves at a different speed as the scrolling, giving the perspective, true “Parallax” effect. the first one I came across in this forum was the header image of http://www.sfsinc.org & http://demo.athemes.com/intro/.

I hope several other mouse fans, like myself could use the answer to the following two questions:
• Is it possible to achieve a true Parallax effect, at least in the header (if not in the other sections) and how?
• Is it possible to get the background images to resize to fill (cover) the background of widgets on ALL screen sizes (responsive design) and how?

My background images were created to be stretched in any direction and still work. I understand that since the smaller screens with this theme change from background image to something else, instead of responding. The header had a place for an alternative image and shows in full on iPhone.

If I have to remove all background images from this theme because only plain “colors” are the only choice the functions, them I’ve lost both of the two reasons for selecting your theme from the list of demos.

I like a LOT of other people love your work and this theme. Thank you for your hard work and time with this long question.

Hello, first I want to congratulate you with styling of your website and this theme, very nice.

Now, regarding your long question.

So many are having trouble getting it to work well on smaller screens...

Well, theme is responsive. Content fits device screen size (you dont have to look for content left or right on smart phone or tablet, there is only up or down). There can possibly be small variations regarding displaying content which depends of web browser you are using. On the other hand if you used too many custom css styling maybe you altered some of default settings to grid for this template.

Two links that you are referring to are not for this theme. Theme you are using is Moesia.

Regarding parallax, if you are referring to ex. this http://keithclark.co.uk/articles/pure-css-parallax-websites/demo3/ , it can’t be achieved, sorry.

Background images filling the background? Here I added some dummy pic as background for services:
https://www.dropbox.com/s/69ki0hvx46vzqt5/background-strech01.jpg?dl=0
and on smaller screen it still covers the background:
https://www.dropbox.com/s/55ii13c3mohw7oy/background-strech02.jpg?dl=0

This is my best regarding your question, I hope that Vlad will find some time to share his thoughts with you regarding this.

Thank you for your detailed response and the time it took to write. I guess I have to give up on True parallax unless I can find a very similar theme that uses page builder so I will not have to completely start over with this huge site.
The problem remains for the background images. Since the page is transformed into a very long page, my background images in landscape do not cover the bottom portion of my iPhone widget sections. If I only knew how, they could be tiled, stretched, and generally reshaped if needed but the transformation from a landscape page on computers to a elongated list is probably the true problem.
The header section has the option to add a second image that seems to at least fit the image onto the screen. I could add a second image that is more portrait ( a LOT more portrait ) that would stand in and fill the cell phone images of small screen, but once again I have no idea how to do that.
judging from the volume of other people on here seeking help with this problem I’m guess it would probably have to be included in an update.
Thanks again for your time.

Im out of the country so cant help much, but Ill give it a shot.
The parallax thing is a matter of opinion; I like it pure CSS, I guess you like it handled by JS.

Regarding the image thing:

  • you’re adding the image from the plugin, not from the theme. So there isnt an option to add in an update. Except if you’re using the option marked as deprecated. Bu Ill have a look to see if anything can be added in this regard.
    And about people asking about this, people seem to expect that the theme will handle all images for them and magically make any background image size look great on any device :slight_smile:

Written from the phone, sorry for any mistake.