Identifying the components of a floating toolbar / toolbox
Posted on 2012-04-06
I have a basic understanding of html and how and where things typically link in a website. I am not very familiar with css, jquery, ajax, hooks, floats, etc... etc... but I like to tinker.
What I am looking to essentially duplicate can be found at www dot tripplite dot com. Am I right in calling this a floating toolbar? Would it still be called a sidebar? As I have been reading up on this stuff.. I have come to see a sidebar as a widget that is a primary part of the website page. I only want this element to truly float above the site, regardless of the content below it.
To start, I would just like to find out how to identify the files required to make this object work. Where does the CSS go, is there php? where do the images go? etc...
I really just need help finding the parts.
Once I can for the most part duplicate this thing, I am sure I can figure out how to change the text and links. I have inspected this element and it's code already but can't gleam any clues as to it's "total" construction. The next step will be sizing the visible bar when it is collapsed. I might want to add a small logo or icon to the bottom, etc. If it is based on some graphic files, great! I can edit those to achieve what i need.
Can anyone help point me in the right direction?
The website I am looking to implement this on is built on Wordpress, but self-hosted, and runs on a linux server. Apache v.2.2.21, PHP v.5.2.17. Please ask if you need any other information from me.