Welcome to TalkGraphics.com
Page 2 of 4 FirstFirst 1234 LastLast
Results 11 to 20 of 33
  1. #11
    Join Date
    Aug 2000
    Location
    Harwich, Essex, England
    Posts
    21,895

    Default Re: An alternative to using multiple pop-up layers

    Hi Acorn,

    I'm not on a crusade here. Your solution works very well. However it would have 50 pages. My solution has 1 page with 1 pop-up layer. It's not adhereing to the Xara WYSIWYG method of web design I'll admit but that's not my purpose here. Even if you create seperate 'berth001.htm' files they come accompanied with their 'berth001_file_folders'.

    The berth links on the index page are pure Page Links but with the Open in link (destination) of the Name 'marina' directly in the input box. This opens the page in the Placeholder.
    I did have issues finding how you loaded the individual pages into the placeholder until I came across this, so I'll post my 'visual' of the solution.

    Meanwhile I'll develop my tutorial for anyone that's interested
    Attached Thumbnails Attached Thumbnails Click image for larger version. 

Name:	export.png 
Views:	58 
Size:	37.0 KB 
ID:	127842  
    Egg

    Intel i7 - 4790K Quad Core + 16 GB Ram + NVIDIA Geforce GTX 1660 Graphics Card + MSI Optix Mag321 Curv monitor
    + Samsung 970 EVO Plus 500GB SSD + 232 GB SSD + 250 GB SSD portable drive + ISP = BT + Web Hosting = TSO Host

  2. #12
    Join Date
    Apr 2018
    Location
    Barnes, London
    Posts
    947

    Default Re: An alternative to using multiple pop-up layers

    Meanwhile I'll develop my tutorial for anyone that's interested
    @Egg: As said earlier in this thread, I would like to understand what code goes where. An example XAR would be welcome.

    @Acorn - thanks for sharing. I can see a use for the page-within-a-page approach too.

    Gary

  3. #13
    Join Date
    Aug 2000
    Location
    Harwich, Essex, England
    Posts
    21,895

    Default Re: An alternative to using multiple pop-up layers

    @ initostar. Sorry wasn't ignoring you, just trying to create a set of video tutorials on using this method.

    This is the first one. If anyone is interested in what's going on in the background you can try & follow my mumblings. If your not interested I will upload all the required files later and you can mess with them as you wish without understanding the underlying code

    Egg

    Intel i7 - 4790K Quad Core + 16 GB Ram + NVIDIA Geforce GTX 1660 Graphics Card + MSI Optix Mag321 Curv monitor
    + Samsung 970 EVO Plus 500GB SSD + 232 GB SSD + 250 GB SSD portable drive + ISP = BT + Web Hosting = TSO Host

  4. #14
    Join Date
    Aug 2000
    Location
    Harwich, Essex, England
    Posts
    21,895

    Default Re: An alternative to using multiple pop-up layers

    Here's the second mumble on the construction of the example tutorial I wrote. Again this only tries to show how things are acheived, if your not interested please view my final video in this series (comming shortly) which will just show how to use the files without the need to understand how it works

    Egg

    Intel i7 - 4790K Quad Core + 16 GB Ram + NVIDIA Geforce GTX 1660 Graphics Card + MSI Optix Mag321 Curv monitor
    + Samsung 970 EVO Plus 500GB SSD + 232 GB SSD + 250 GB SSD portable drive + ISP = BT + Web Hosting = TSO Host

  5. #15
    Join Date
    Aug 2000
    Location
    Harwich, Essex, England
    Posts
    21,895

    Default Re: An alternative to using multiple pop-up layers

    Here's the final tutorial. If you're not interested in the code behind this method you can just use this tutorial to create a single page, single pop-up webpage.

    Egg

    Intel i7 - 4790K Quad Core + 16 GB Ram + NVIDIA Geforce GTX 1660 Graphics Card + MSI Optix Mag321 Curv monitor
    + Samsung 970 EVO Plus 500GB SSD + 232 GB SSD + 250 GB SSD portable drive + ISP = BT + Web Hosting = TSO Host

  6. #16
    Join Date
    Aug 2000
    Location
    Harwich, Essex, England
    Posts
    21,895

    Default Re: An alternative to using multiple pop-up layers

    It's late now, I'll post the xar files tomorrow.
    Egg

    Intel i7 - 4790K Quad Core + 16 GB Ram + NVIDIA Geforce GTX 1660 Graphics Card + MSI Optix Mag321 Curv monitor
    + Samsung 970 EVO Plus 500GB SSD + 232 GB SSD + 250 GB SSD portable drive + ISP = BT + Web Hosting = TSO Host

  7. #17
    Join Date
    Aug 2000
    Location
    Harwich, Essex, England
    Posts
    21,895

    Default Re: An alternative to using multiple pop-up layers

    Last edited by Egg Bramhill; 13 September 2020 at 03:15 PM. Reason: Wrong link
    Egg

    Intel i7 - 4790K Quad Core + 16 GB Ram + NVIDIA Geforce GTX 1660 Graphics Card + MSI Optix Mag321 Curv monitor
    + Samsung 970 EVO Plus 500GB SSD + 232 GB SSD + 250 GB SSD portable drive + ISP = BT + Web Hosting = TSO Host

  8. #18
    Join Date
    Aug 2000
    Location
    Harwich, Essex, England
    Posts
    21,895

    Default Re: An alternative to using multiple pop-up layers

    Here's a zipped folder of the required files.
    Attached Files Attached Files
    Last edited by Egg Bramhill; 13 September 2020 at 03:36 PM. Reason: Removed publish details from the xar file
    Egg

    Intel i7 - 4790K Quad Core + 16 GB Ram + NVIDIA Geforce GTX 1660 Graphics Card + MSI Optix Mag321 Curv monitor
    + Samsung 970 EVO Plus 500GB SSD + 232 GB SSD + 250 GB SSD portable drive + ISP = BT + Web Hosting = TSO Host

  9. #19
    Join Date
    Apr 2012
    Location
    SW England
    Posts
    17,746

    Info Re: An alternative to using multiple pop-up layers

    This is another approach using a very simple jQuery construct in the Object's Links that hide everything and then reveal the item in the second part of the construct: e.g., javascript: void $('.marina').hide(); void $('.b001').show();

    The design is for XDPXv16 and later, using the following concepts:
    • LiveCopies of each of the Berth's details in a large 7x7 grid - clearly expandable...
      • Each Berth has a special Name of htmlclass="bNumber" as in "b003" is Berth 003.
      • Each LiveCopy is copied and a different Name applied: "marina b003" - you must remove the first "b003" and create "marina b003" in its place
      • The content of the LiveCopy are all saved as separate Images (for groups)
      • All are dragged into the first page and scaled up and stacked.
      • Edit changes are applied to the original LiveCopy on the bookings page. Such changes are reflected onto the index page automatically.

    • A Link then hides all Objects with a ClassName of "marina" (only on the index page) and shows the one Berth "b002"
    • The Marina Objects have a Class Name of "marina layout" so can be fetch back from withing a LiveCopy of a separate index page Link.
    • If you click Berth002 and then the image, you are taken the the bookings page.


    No Layers are used.
    There is a second page but this has become a feature.

    Technically, there is no added code as everything clever in in the Links.
    The Links can be tweaked to employ other jQuery Effects.

    JS - Marina.xar

    Acorn

    See Attachment 127835 for the more general Embed a Website approach (https://www.talkgraphics.com/showthr...326#post628326).
    Acorn - installed Xara software: Cloud+/Pro+ and most others back through time (to CC's Artworks). Contact for technical remediation/consultancy for your web designs.
    When we provide assistance, your responses are valuable as they benefit the community. TG Nuggets you might like. Report faults: Xara Cloud+/Pro+/Magix Legacy; Xara KB & Chat

  10. #20
    Join Date
    Aug 2000
    Location
    Harwich, Essex, England
    Posts
    21,895

    Default Re: An alternative to using multiple pop-up layers

    Interesting approach Acorn. Currently I can't even see how the jQuery is loaded. I see it is but from where on your 'site'?
    Egg

    Intel i7 - 4790K Quad Core + 16 GB Ram + NVIDIA Geforce GTX 1660 Graphics Card + MSI Optix Mag321 Curv monitor
    + Samsung 970 EVO Plus 500GB SSD + 232 GB SSD + 250 GB SSD portable drive + ISP = BT + Web Hosting = TSO Host

 

 

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
  •