[Pro] Sliding navigation

Can anyone tell me how this sliding navigation is done on this website please and if it can be done using FW? I would also like to know which action would be used for the photos?
Thanks.


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Hi Liz,

this is an entirely flash-built page so the simple answer is:

No and nothing. You shouldn’t mind further about that bling-bling stuff cause it’s more than outdated (just my personal view) to go this way down the road.

Modern tools like:

shall fill that gap but I’m not really convinced (my personal view again) about this.

Hard to recommend “something similar” using JavaScript, but there might be a couple of jQueries or even Scripty stuff out there to simulate this - but not out of the box - as far as I can see.

Cheers

Thomas


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Elizabeth wrote:

Can anyone tell me how this sliding navigation is done on this website please and if it can be done using FW? I would also like to know which action would be used for the photos?
This could be replicated with hand-rolled javascript and possibly with
an HTML/CSS/js animation tool, but as far as a point-n-click solution
with an action(s) I can’t say.

Todd
http://xiiro.com


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Hi Tomas

Thanks for your comments, but my client is insistent that this is what he wants. He specifically wants the navigation to open this way.
I’ll investigate the link you gave - will it work on FW?

regards
Elizabeth

On 31/08/2012, at 11:42 PM, Thomas Kimmich wrote:

Hi Liz,

this is an entirely flash-built page so the simple answer is:

No and nothing. You shouldn’t mind further about that bling-bling stuff cause it’s more than outdated (just my personal view) to go this way down the road.

Modern tools like:

shall fill that gap but I’m not really convinced (my personal view again) about this.

Hard to recommend “something similar” using JavaScript, but there might be a couple of jQueries or even Scripty stuff out there to simulate this - but not out of the box - as far as I can see.

Cheers

Thomas


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

I would be suggesting to your client that if he insists on a Flash solution he will be alienating all the iOS users out there unless you provide fallback options - more work for you and more expense for him!

I appreciate this is the ‘look’ that he wants and he wont care how you get that look - Flash or not. Hype will be able to do something similar but you will need to spend some time over it.

Unfortunately there isn’t a simple action solution to this.

David


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Thanks Dave

I checked out the website and another one he likes using similar styles on my iPhone and that style of navigation doesn’t work it’s replaced with a drop down menu instead.

Thanks a lot for the advice. He has been stung pretty badly with his current website, i.e. paid a huge amount upfront and ongoing for a straight forward five pages so I will discuss this with him and look into Hype.

Elizabeth

On 01/09/2012, at 7:58 AM, DeltaDave wrote:

I would be suggesting to your client that if he insists on a Flash solution he will be alienating all the iOS users out there unless you provide fallback options - more work for you and more expense for him!

I appreciate this is the ‘look’ that he wants and he wont care how you get that look - Flash or not. Hype will be able to do something similar but you will need to spend some time over it.

Unfortunately there isn’t a simple action solution to this.

David


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Elizabeth wrote:

I will discuss this with him and look into Hype.
Also look at Sencha Animator.

If all else fails you could always hire someone to replicate (hand-code)
the menu using javascript for the effect.

Todd
http://xiiro.com


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Hi again Thomas / Dave

I’ve looked at Hype, looks interesting, but where would I be able to insert the three lines of code on a FW page? Using the Page>HTML mark up? and the positioning of it?

Thanks
Elizabeth

On 31/08/2012, at 11:42 PM, Thomas Kimmich wrote:

Hi Liz,

this is an entirely flash-built page so the simple answer is:

No and nothing. You shouldn’t mind further about that bling-bling stuff cause it’s more than outdated (just my personal view) to go this way down the road.

Modern tools like:

shall fill that gap but I’m not really convinced (my personal view again) about this.

Hard to recommend “something similar” using JavaScript, but there might be a couple of jQueries or even Scripty stuff out there to simulate this - but not out of the box - as far as I can see.

Cheers

Thomas


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

If you want code to appear somewhere specific on the page, you would use the Insert / Markup Item dialog from the main menu, either applied to the page (which creates a positioned DIV you can drag around and resize to hold whatever you place inside it) or an inline instance of the same menu item, which won’t resize, but won’t have any size attributes at all, so it can enlarge to suit your contents.

Walter

On Aug 31, 2012, at 8:17 PM, Elizabeth wrote:

Hi again Thomas / Dave

I’ve looked at Hype, looks interesting, but where would I be able to insert the three lines of code on a FW page? Using the Page>HTML mark up? and the positioning of it?

Thanks
Elizabeth


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Thanks Walter

I use Insert / Markup quite a lot, but wasn’t sure about it for Tumult Hype. I have since carried on reading and found quite a lot of information and help on their site including Paul Dunning’s action for it.

Many thanks to all who have answered so far.

Elizabeth

On 01/09/2012, at 10:13 AM, Walter Lee Davis wrote:

If you want code to appear somewhere specific on the page, you would use the Insert / Markup Item dialog from the main menu, either applied to the page (which creates a positioned DIV you can drag around and resize to hold whatever you place inside it) or an inline instance of the same menu item, which won’t resize, but won’t have any size attributes at all, so it can enlarge to suit your contents.

Walter

On Aug 31, 2012, at 8:17 PM, Elizabeth wrote:

Hi again Thomas / Dave

I’ve looked at Hype, looks interesting, but where would I be able to insert the three lines of code on a FW page? Using the Page>HTML mark up? and the positioning of it?

Thanks
Elizabeth


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

I hand-coded a quick-n-dirty example using jQuery that simulates the
below menu and took some creative license in the process. I didn’t have
time to exactly replicate your example nor is the javascript as lean and
efficient as it should be but it works and is similar enough to provide
a good jumping-off point that can be further tweaked to your hearts
content by hand.

All the code (HTML, CSS, js) can be copied and inserted into a FW doc
through various and sundry methods. It’s not a perfect or ideal solution
but it is more accessible and lightweight than Flash and would make for
good hands-on code editing practice.

http://xiiro.com/demo/jquery-menu/index.html

Todd
http://xiiro.com

Elizabeth wrote:

Can anyone tell me how this sliding navigation is done on this website please and if it can be done using FW?

http://www.chasecrown.com.au/


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Btw, if you do copy the HTML to a local file please remove the
StatCounter code so I don’t get inflated visitor counts. Also, I made
some adjustments to the effects.

Thanks,

Todd
http://xiiro.com

Todd wrote:

All the code (HTML, CSS, js) can be copied and inserted into a FW doc
through various and sundry methods.

http://xiiro.com/demo/jquery-menu/index.html


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Great example Todd - cant believe you wrote this quick ‘n’ dirty so fast.

Stolen and put in the files for later re-use sans statcounter.

Thanks - David


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Thanks David. Having reusable laying around code speeds-up the
quick-n-dirty process.

Todd
http://xiiro.com

DeltaDave mailto:email@hidden
September 2, 2012 4:55 PM
Great example Todd - cant believe you wrote this quick ‘n’ dirty so fast.

Stolen and put in the files for later re-use sans statcounter.


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

This looks very interesting and it may appeal to this potential client. How would this be inserted into FW - an Insert mark up item or HML Mark up Before or? Cost?

Regards
Elizabeth

On 02/09/2012, at 12:54 PM, Todd wrote:

I hand-coded a quick-n-dirty example using jQuery that simulates the below menu and took some creative license in the process. I didn’t have time to exactly replicate your example nor is the javascript as lean and efficient as it should be but it works and is similar enough to provide a good jumping-off point that can be further tweaked to your hearts content by hand.

All the code (HTML, CSS, js) can be copied and inserted into a FW doc through various and sundry methods. It’s not a perfect or ideal solution but it is more accessible and lightweight than Flash and would make for good hands-on code editing practice.

http://xiiro.com/demo/jquery-menu/index.html

Todd
http://xiiro.com

Elizabeth wrote:

Can anyone tell me how this sliding navigation is done on this website please and if it can be done using FW?

http://www.chasecrown.com.au/


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

The HTML (just the menu code) would go in a markup item and inserted
into the layout. The js and CSS could go in the head tag but it would be
better to put them in separate files. There are actions to reference
external (non-FW) files. It might be possible to reconstruct the menu
directly from within FW which might make updating it a bit easier, but
someone else can answer that since I don’t know (haven’t used FW in a
while).

Keep in mind the editing process for this example will be hands-on and
the js file will have to be updated accordingly so be sure you’re
comfortable with editing the code.

Todd

Elizabeth wrote:

This looks very interesting and it may appeal to this potential client. How would this be inserted into FW - an Insert mark up item or HML Mark up Before or? Cost?


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

And remember Elizabeth that if you want to use this there is a potential conflict between the jQuery javascript library that this utilises and the Script/Protaculous javascript libraries that FW’s core actions use.

In other words they shouldn’t share the same page.

David


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

So Dave, I also need to include a gallery of photos on one or possibly more of the pages - this sliding nav will conflict with this?

And thanks Todd.

I’d really like to be able to do this.

On 03/09/2012, at 8:55 AM, DeltaDave wrote:

And remember Elizabeth that if you want to use this there is a potential conflict between the jQuery javascript library that this utilises and the Script/Protaculous javascript libraries that FW’s core actions use.

In other words they shouldn’t share the same page.

David


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

If the gallery is created with a core FW action, yes. You could always
go with a jQuery based gallery instead, of which there are dozens. Using
actions can be a double-edged sword because it ties you into using one
js library which can sometimes limit your design options.

That said, it is possible to run 2 different libraries on the same page
but the downside to this approach is the extra “weight”. It can work but
it’s not efficient and isn’t recommended. Best to stick with one library
per project.

Todd

Elizabeth wrote:

So Dave, I also need to include a gallery of photos on one or possibly more of the pages - this sliding nav will conflict with this?

And thanks Todd.

I’d really like to be able to do this.


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

I would make sure that the client is happy with the navigation before committing to the jQuery solution. Another thing to consider is how to link your nav to other possible effects that you might want to use - like rollover triggers - as this will have to be a hand coded route too.

Once the nav is agreed then you will need to discuss with the client what sort of gallery they want - at that point we can probably point you in the direction of a suitable jQuery option.

But you are getting to the stage where a lot of FW’s actions are going to be out of your reach on this project if this navigation is going to appear on every page.

A better (than me) coder/js guru would/should be able to translate that jQuery code into Script/Protaculous based stuff but there is really only 1 man here that has that experience - and he is a busy man!

Just make sure that you are not digging yourself too deep a hole.

D


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options