Welcome to TalkGraphics.com
Page 1 of 2 12 LastLast
Results 1 to 10 of 13
  1. #1
    Join Date
    Nov 2023
    Posts
    11

    Default button position should always be on the outside

    Hi everyone,

    I have already tried a few things, but never found a satisfactory solution.

    How can I make the "top button" (scroll up again by clicking on it) that always appear on the right outside, regardless of the screen width?

    Do you have a solution for me?

  2. #2
    Join Date
    Dec 2018
    Location
    Australia
    Posts
    1,728

    Default Re: button position should always be on the outside

    You need to place the top button off the page area. If it's sticky it will show on the very edge of the screen. If it isn't sticky, it won't show at all.

    If you want the button to not be on the very edge, you can add a rectangle to push it away. make the rectangle 99% transparent and group with the button.

    Click image for larger version. 

Name:	schlumpumpie1.jpg 
Views:	118 
Size:	36.5 KB 
ID:	134296 Click image for larger version. 

Name:	schlumpumpie2.jpg 
Views:	135 
Size:	32.7 KB 
ID:	134297

  3. #3
    Join Date
    Nov 2023
    Posts
    11

    Default Re: button position should always be on the outside

    Hi Chris and thanks for your support.
    That works.
    But this way the button is always visible.
    Is there a possibility that the button is only visible from a certain height or only at the bottom?

  4. #4
    Join Date
    Nov 2023
    Posts
    11

    Default Re: button position should always be on the outside

    i was able to solve it myself. i only needed to make the link to a named object.
    Now it only appears when the object appears.
    Thank you Chris you have put me on the right way.

  5. #5
    Join Date
    Dec 2018
    Location
    Australia
    Posts
    1,728

    Default Re: button position should always be on the outside

    Certainly. We're going to play with 'Reveal' under the Web Animation section.

    What we're going to do:
    Use an object to trigger the appearance of your button. Your button will remain hiding until the trigger object pops its head up at the bottom of the screen as the page scrolls.

    If you have a picture, or shape that will just come into view when you want your button to appear, then we'll use that. If not, create a rectangle and place it on the page where you want it.
    Name the object by: highlight the object and click Utilities > Names and name the object anything you like (I name mine trigger1, trigger2 ect. because I have no imagination).
    Now select your button and click Utilities > Web Animation > Reveal/Scroll (tab) > Reveal Animation (radio button) > Trigger Object Name, and choose trigger1, or whatever you named it.
    You can choose an animation to have the button appear.

    Test and adjust as needed. If you created a rectangle, colour it the same as your background, or give it a 99% transparency.

  6. #6
    Join Date
    Apr 2012
    Location
    SW England
    Posts
    17,651

    Default Re: button position should always be on the outside

    Quote Originally Posted by Chris M View Post
    If you want the button to not be on the very edge, you can add a rectangle to push it away. make the rectangle 99% transparent and group with the button.
    @Chris, there is a cleaner way to move the shape of the browser (right) edge.
    Give it a Name of 'top' & add this Page Head code:
    <style>
    .xr_stickie:has( > a > span[id="top"] ) {
    right: 20px !important;
    }
    </style>
    The :has() Pseudo-class is relatively new but it handles things where CSS had a itch before; basically getting to the parent of an element.
    You do have to craft it for top, bottom, left or right scenarios. Read https://css-tricks.com/the-css-has-selector/.

    Acorn
    Acorn - installed & active Xara software: Cloud+/Pro+, XDPXv18 , XWDPv12/v15, XPGDv10, X3D7, Xara Xtreme 5, and others back through time (to CC's Artworks).
    Technical remediation and consultancy for your web designs. TG Nuggets you might like. Report faults: Xara Cloud+/Pro+/Magix Legacy; Xara KB & Chat

  7. #7
    Join Date
    Dec 2018
    Location
    Australia
    Posts
    1,728

    Default Re: button position should always be on the outside

    Quote Originally Posted by Acorn View Post
    @Chris, there is a cleaner way to move the shape of the browser (right) edge.
    Give it a Name of 'top' & add this Page Head code:
    <style>
    .xr_stickie:has( > a > span[id="top"] ) {
    right: 20px !important;
    }
    </style>
    The :has() Pseudo-class is relatively new but it handles things where CSS had a itch before; basically getting to the parent of an element.
    You do have to craft it for top, bottom, left or right scenarios. Read https://css-tricks.com/the-css-has-selector/.

    Acorn
    It's always good to have options.

  8. #8
    Join Date
    Feb 2023
    Location
    England
    Posts
    113

    Default Re: button position should always be on the outside

    Quote Originally Posted by Chris M View Post
    You need to place the top button off the page area. If it's sticky it will show on the very edge of the screen. If it isn't sticky, it won't show at all.

    If you want the button to not be on the very edge, you can add a rectangle to push it away. make the rectangle 99% transparent and group with the button.

    Click image for larger version. 

Name:	schlumpumpie1.jpg 
Views:	118 
Size:	36.5 KB 
ID:	134296 Click image for larger version. 

Name:	schlumpumpie2.jpg 
Views:	135 
Size:	32.7 KB 
ID:	134297
    I've tried this Chris and i can't make it work. Can you be more detailed please! Thank you

  9. #9
    Join Date
    Feb 2023
    Location
    England
    Posts
    113

    Default Re: button position should always be on the outside

    Well!!! Another Xara pro + glitch. Your soloution works with Xara Designer x19 Chris, but not with xara +.
    I seem to work more with xara x19 lately. I come across bugs almost every day in xara+.
    Thanks anyway.

  10. #10
    Join Date
    Apr 2012
    Location
    SW England
    Posts
    17,651

    Default Re: button position should always be on the outside

    Quote Originally Posted by Andre7 View Post
    Well!!! Another Xara pro + glitch. Your soloution works with Xara Designer x19 Chris, but not with xara +.
    I seem to work more with xara x19 lately. I come across bugs almost every day in xara+.
    Thanks anyway.
    It works for me in Pro+. You need to Group and set its Export as a single image.

    Using @Chris's approach means you get an image and that always annoys me, hence the CSS route I suggested.

    If you are hitting Bugs then do report them. Sometimes a method is nuanced and you might not understand the logic behind the feature.

    Acorn
    Acorn - installed & active Xara software: Cloud+/Pro+, XDPXv18 , XWDPv12/v15, XPGDv10, X3D7, Xara Xtreme 5, and others back through time (to CC's Artworks).
    Technical remediation and consultancy for your web designs. TG Nuggets you might like. Report faults: Xara Cloud+/Pro+/Magix Legacy; Xara KB & Chat

 

 

Tags for this Thread

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
  •