Welcome to TalkGraphics.com
Page 2 of 2 FirstFirst 12
Results 11 to 14 of 14
  1. #11
    Join Date
    Apr 2018
    Location
    London
    Posts
    245

    Default Re: Stick to the right margin

    Quote Originally Posted by gcellison View Post
    Hi Gary,

    The thread where the parallax issue was discussed and the problem with Scale to fit width came to light is HERE.

    If you open up the page in different browsers, you'll see the strange behavior.

    If you then remove the Scale to fit width property, the parallax effect works in all browsers.
    Hi Greg,

    I remember the thread now and looking at what at the TGer was trying to achieve. I read back through the thread and I guess I am missing something here. I created a new demo, three scrolling objects at different rates, one of which was a photo set to full width, and exported with Scale-to-fit-Width (the photo needs of course to be a higher resolution). https://initiostar.co.uk/demo/parallax/. On my 4k screen it scaled OK and the parallax scroll seemed to work? Does the example work in your browser?

    Gary

  2. #12
    Join Date
    Mar 2018
    Location
    Morelos, Mexico
    Posts
    150

    Default Re: Stick to the right margin

    Hi Gary,

    The parallax works for me in Chrome, Firefox, and Edge. It has a very slow crawl up the page.

    The previous thread concerned the type of image that is below the fold and which appears as the user scrolls down, but the image is completely stationary. It disappears under the continued scrolling. I don't think this is possible in Xara natively. I had found the way this works using the code:
    <style>
    .parallax {
    background-attachment: fixed !important;
    background-position: top center !important;
    background-size: cover !important;
    }
    </style>

    and it works very well in all the browsers. But once you activate Scale to fit width, it starts to behave oddly.

    At the time Egg posted, he was using that feature, and the unusual behavior could be seen. Since then, he apparently removed it for what we now see on his demo. The "stationary" parallax works great.

  3. #13
    Join Date
    Apr 2018
    Location
    London
    Posts
    245

    Default Re: Stick to the right margin

    Hi Greg,

    The parallax works for me in Chrome, Firefox, and Edge. It has a very slow crawl up the page
    I could have made any objects parallax scroll faster, but the good news is that Xara out-of-the-box works fine with Scale-to-fit-Width, unless you want to do something a bit more clever that requires code.

    Click image for larger version. 

Name:	Parallax Speed.PNG 
Views:	4 
Size:	92.2 KB 
ID:	127075

    If you want a moment's entertainment set up an object that reveals on a named trigger, then apply a parallax scroll to the same object, where you will see the name of your trigger greyed out; kind of counter-intuitive but an interesting effect when the object is sandwiched between two overlays.

    Over on out in this now!

    Gary

  4. #14
    Join Date
    Mar 2018
    Location
    Morelos, Mexico
    Posts
    150

    Default Re: Stick to the right margin

    Hi Gary,

    Quote Originally Posted by Initiostar View Post
    I could have made any objects parallax scroll faster, but the good news is that Xara out-of-the-box works fine with Scale-to-fit-Width, unless you want to do something a bit more clever that requires code.Gary
    Right. Since you had asked if the parallax worked for me, I was just wanted to give details on how it appeared. In fact, the ultimate objective would be to have an image that doesn't scroll at all, but that is located below the fold.

    If you want a moment's entertainment set up an object that reveals on a named trigger, then apply a parallax scroll to the same object, where you will see the name of your trigger greyed out; kind of counter-intuitive but an interesting effect when the object is sandwiched between two overlays.
    That sounds like a cool possibility. I will definitely give it a try.

    Greg

 

 

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •