Wow! Renoir, merci!
It's been a little while I haven't really "played" with Javascript and
jQuery so your explaination serves as a refresher. Thanks.

I didn't think of using a jQuery function. I was set on using a CSS
solution and I was wondering if there were an easy way to achieve this from
within Bootstrap, maybe a CSS component that might have permit to render
the whole navbar element completely clickable.

I guess I'll have to go the jQuery route then. And thinking about it now,
it's way easier that way.

Merci encore, from a fellow Montrealer.



Yves Chaput
yveschaput.com
514-993-6432


2013/8/22 Renoir Boulanger <[email protected]>

>
> Hi,
>
> This is not a Twitter Bootstrap issue.  It is a basic JavaScript question
> but i'll answer it and it might grab your attention to learn more about
> basics by yourself.
>
> Each elements in the browsers broadcast events.  Mouse in, mouseout,
> click, mousedown, scrollup (see [0]) and you can grab and act on them [1]
>
>
>     $('body').on('click', 'body > .navbar', function(event){
>  $(event).preventDefault(); window.location = 'foo.html'; });
>
> This code assumes you put the navbar as a direct child of the body ( see
> '>' in [2] section 2. selectors ).
>
> Take note that I do not attach 'on' on the navbar itself but on the body
> so you now know its possible.  In fact I personally prefer attach event on
> a known parent of a HTML pattern in more complex situations...but it is
> always safe to assume you will have a parent 'body' tag.
>
> As you should know, the term 'click' is only an event name triggered when
> yoh click the element described by the selector.  This means that you can
> create ANY event you might want...even namespace them (e.g. 'myapp.saidyo')
> and play with event bubbling.
>
> Read what Douglas Crockford has to say about JavaScript Events ;)
>
>
> Make sure you put that code in a $(document).readyfunction(){}); as it
> will wait to attach the event 'on' when the full DOM is loaded.
>
> Also, in a situation of an event can happen only once (here, the click on
> .nav changes the location) you could use 'one' instead of 'on'.
>
>
> I hope I gave you enough insight to get started learning.
>
>   [0]:
> http://www.w3.org/TR/DOM-Level-3-Events/#events-mouseevent-event-order
>   [1]:http://api.jquery.com/on/
>   [2]:http://www.w3.org/TR/css3-selectors/
>
> Regards,
>
> Renoir Boulanger  |  Developer operations engineer
> W3C  |  Web Platform Project
>
> https://renoirboulanger.com/  ✪  @renoirb
> ~
>
> --
> You received this message because you are subscribed to a topic in the
> Google Groups "twitter-bootstrap" group.
> To unsubscribe from this topic, visit
> https://groups.google.com/d/topic/twitter-bootstrap/EAoGwWuDECU/unsubscribe
> .
> To unsubscribe from this group and all its topics, send an email to
> [email protected].
> For more options, visit https://groups.google.com/groups/opt_out.
>

-- 
You received this message because you are subscribed to the Google Groups 
"twitter-bootstrap" group.
To unsubscribe from this group and stop receiving emails from it, send an email 
to [email protected].
For more options, visit https://groups.google.com/groups/opt_out.

Reply via email to