7 Attachment(s)
Re: JS Hamburger Menu (Acorn)
Quote:
Originally Posted by
Chris M
Pretty comfortable with the theory now, although I don't claim to know 70% of the actual code.
I can dive in and change the speed of animation, toggle and slide, slideUp, hide and fade, but that's about it.
Link to my efforts <
HERE > along with Acorn's code that makes it work.
And the .web for anyone who wants edit/add/expand the page.
Attachment 127542
Thanks for sharing Chris. I had a play with your example and added a 'take-me-home' button (edition attached)
Attachment 127545
Next, I thought let's combine Acorn's ideas with the animated popup concept to extend animation through standard Xara. In the example, the link brings the selected class into view and opens a popup at the same time in a step-by-step approach.
Attachment 127547 Example attached
Then going back in the thread to the @LGF challenge and a simple NavBar, I made one with no code at all with a standard go to Top-of-Page button, where the menu is revealed by sliding in from the top. The login's are sticky so always in view whereas the additional buttons slide upwards out of view, but are brought back with the Top of Page button.
Attachment 127549 Example attached.
Thanks to you and Acorn for the ideas.
Gary
Re: JS Hamburger Menu (Acorn)
Quote:
Originally Posted by
Initiostar
Thanks for sharing Chris. I had a play with your example and added a 'take-me-home' button (edition attached)
Attachment 127545
Next, I thought let's combine Acorn's ideas with the animated popup concept to extend animation through standard Xara. In the example, the link brings the selected class into view and opens a popup at the same time in a step-by-step approach.
Attachment 127547 Example attached
Then going back in the thread to the @LGF challenge and a simple NavBar, I made one with no code at all with a standard go to Top-of-Page button, where the menu is revealed by sliding in from the top. The login's are sticky so always in view whereas the additional buttons slide upwards out of view, but are brought back with the Top of Page button.
Attachment 127549 Example attached.
Thanks to you and Acorn for the ideas.
Gary
Gary, thank you for taking these further down the line.
We probably need siran to convert javascript: void $('.cover, .step1, .step2, .step3, .step4 ').hide(0);xr_ppc("xr_xp4");xr_ppc("xr_xp5");xr_cp u(6); into a Domain Specific Language construct (akin to Xara's popup syntax).
P.S. The javascript: void $('.cover, .step1, .step2, .step3 .step4 '); part you had in earlier Steps does nothing. It need an action to perform over that collection like the hide(0) here.
In the Toggle.xar file, I added WebAmination > Click: Rotate-fade + Fast to the controls. Very satisfying.
Acorn
1 Attachment(s)
Re: JS Hamburger Menu (Acorn)
Quote:
Gary, thank you for taking these further down the line.
We probably need siran to convert javascript: void $('.cover, .step1, .step2, .step3, .step4 ').hide(0);xr_ppc("xr_xp4");xr_ppc("xr_xp5");xr_cp u(6); into a Domain Specific Language construct (akin to Xara's popup syntax).
P.S. The javascript: void $('.cover, .step1, .step2, .step3 .step4 '); part you had in earlier Steps does nothing. It need an action to perform over that collection like the hide(0) here.
In the Toggle.xar file, I added Web Animation > Click: Rotate-fade + Fast to the controls. Very satisfying.
Acorn
Thanks for your advice Acorn. I removed the redundant code; all continued to work OK.
I added your suggestion to Chris's Toggle - slick effect.
Gary
Re: JS Hamburger Menu (Acorn)
Quote:
Originally Posted by
Acorn
LGF, the somebody to help you has to be Xara!
In all versions prior to Xara Pro+v17, I can use the same construct as
Xara; Link to: http://xara.com; Open link: New window, and everything works as expected. Not in Pro+.
UPDATE
The code in the Website Body (code) and the subsequent function calls need to change the function from open() to something else; I have just used
openSesame(chain) and all works as it should.
Acorn
Thank you Acorn - Xara is remarkably weird some times!!!!
Re: JS Hamburger Menu (Acorn)
Quote:
Originally Posted by
Chris M
Thanks Chris M and Acorn
Re: JS Hamburger Menu (Acorn)
Quote:
Originally Posted by
Chris M
You mention thinking about a horizontal bar, that's the way I would go too.
Nice one Chris!
Re: JS Hamburger Menu (Acorn)
Quote:
Originally Posted by
Acorn
LGF, the somebody to help you has to be Xara!
In all versions prior to Xara Pro+v17, I can use the same construct as
Xara; Link to: http://xara.com; Open link: New window, and everything works as expected. Not in Pro+.
UPDATE
The code in the Website Body (code) and the subsequent function calls need to change the function from open() to something else; I have just used
openSesame(chain) and all works as it should.
Acorn
Aaaaarrrrgggghhhh!!! Now when I click on RESOURCES I get a - Not Found - The requested URL has no content.
Re: JS Hamburger Menu (Acorn)
OK - I have to add the sesame bit if I want the drop down menu to open - like I said - 1 forwards, 1 back...
SO does this mean that in the future, when ever I want the JS to open something, I have to add another word like this: javascript: openUp(whatever);
Re: JS Hamburger Menu (Acorn)
Quote:
Originally Posted by
letsgofishing
Aaaaarrrrgggghhhh!!! Now when I click on RESOURCES I get a - Not Found - The requested URL has no content.
LGF, let's assume it's finger trouble.
My last change puts the Link as javascript: openSesame('.Ham4');
If not fingers, can you upload your file?
Acorn
Re: JS Hamburger Menu (Acorn)
Quote:
Originally Posted by
Initiostar
Thanks for sharing Chris. I had a play with your example and added a 'take-me-home' button (edition attached)
Attachment 127545
Next, I thought let's combine Acorn's ideas with the animated popup concept to extend animation through standard Xara. In the example, the link brings the selected class into view and opens a popup at the same time in a step-by-step approach.
Attachment 127547 Example attached
Then going back in the thread to the @LGF challenge and a simple NavBar, I made one with no code at all with a standard go to Top-of-Page button, where the menu is revealed by sliding in from the top. The login's are sticky so always in view whereas the additional buttons slide upwards out of view, but are brought back with the Top of Page button.
Attachment 127549 Example attached.
Thanks to you and Acorn for the ideas.
Gary
Hi Initiostar - thanks for all the thinking and other ideas - appreciated!