Horizontal Hashtag Navigation Trapping Primer Tutorial
Yesterday we got into some hashtag navigation event trapping, after …
- our discovery, during HTML a Tag Navigation Primer Tutorial
- our follow up, during Web Slideshow Like PowerPoint Hashtag Navigation Tutorial
… where that “follow up” was really dealing with “vertical navigation”, which is probably your more natural human idea of web navigation. But what about “horizontal navigation” where the webpage content continues off to the right of your screen, for those of us that read left to right? It should be noted that some languages of the world read right to left, and that is worth considering, should you take up the mantle and use the source code below to continue on with your studies and web application work.
So we applied these thoughts to a recent Ansible and Vagrant Deploys Git and Jenkins Primer Tutorial‘s slideshow presentation to end up with HTML and Javascript you could call horizontal_slideshow.html perhaps, and that changed to cater for horizontal hashtag navigation “event” trapping techniques in this way, and that you can try here, where you can compare the old “@” method versus the new “Start of Movie” horizontal hashtag navigation “event” trapping method, for your perusal and edification.
location.href='#i7'; // navigate to the 8th slide of the slideshow
… as distinct from the (still unchanged) “@” link method where the leftmost “cell” has Javascript DOM slap over it the relevant image data that should happen next for the slideshow to progress forward.
So the new “horizontal navigation” hashtag event trapping uses the same “last three days” way that monitors changes to …
Along the way we try the HTML5 progress element, in preference to the meter element (that we last talked about with HTML/Javascript Staged Animation Meter Presentation Tutorial at this blog), to show you progress through the slideshow when you view it using the new functionality.
So we applied these thoughts to a recent Ansible and Vagrant Deploys Git and Jenkins Primer Tutorial‘s slideshow presentation to end up with HTML and Javascript you could call horizontal_slideshow.html perhaps, and that changed to cater for horizontal hashtag navigation “event” trapping techniques in this way, and that you can try here (and perhaps compare against the old approach here), where you can compare the old “@” method versus the new “Start of Movie” horizontal hashtag navigation “event” trapping method, for your perusal and edification.
If this was interesting you may be interested in this too.
