I am very interested of what jQuery can do and the plugins there is keeps impressing me. I saw the world cup site Twitter did and at the top they were using some kind of dock with the flags of the teams. When I and Henrik Porseland were coding whatisxv.com we wanted a dock with students but the time ran out and we forgot about it.
But now I found jqDock! It’s very easy to use and i will show a very simple example here. You can do both horizontal and vertical dock menus and custom the looks of it very very easy. As I said before I wanted a dock menu with all the students in my class.
This is how I did it:
First of all to use this wonderful plugin you need jQuery v1.2.3 or later. And then you can download the plugin here.
Start with link the files in your <head> tag. Link in the jqDock source (full or compressed) after jQuery itself as in the example below:
<script type='text/javascript' src='jquery-1.2.3.min.js'></script> <script type='text/javascript' src='jquery.jqDock.js'></script>
Create a div and put an ID or Class on it. Then fill it with images that you want in your dock menu. In my example:
<div id="dockmenu"> ... <a href="#"><img src="img/student.jpg" title="Student Name" alt="Student Name" /></a> <a href="#"><img src="img/student.jpg" title="Student Name" alt="Student Name" /></a> <a href="#"><img src="img/student.jpg" title="Student Name" alt="Student Name" /></a> ... </div>
To convert your HTML into a Dock, simply call the jqDock function.
<script type="text/javascript">
$(document).ready(function($) {
$('#dockmenu').jqDock({align:'bottom', size:65, labels:true});
});
</script>
This code will make the menu expand from the bottom and up and every picture will have a label on it. You can see it in my example.
It’s very easy to style your dock menu as well. Here is the CSS for my menu:
div.jqDockWrap{margin:0 auto;}
div.jqDockLabel {color:#fff;background:#000; font-family:Myriad Pro; padding:4px;
font-size:11px;font-weight:normal;margin-top:-25px!important;white-space:nowrap;}
div.jqDockLabel a, a:hover, a:visited{color:#FFF; text-decoration:none;}
#dockmenu{clear:both;display:block;width:100%;position:absolute;text-align:center;
left:0; bottom:0px;}
#dockmenu img{padding:1px;float:left;display:block;}
Good Luck creating your own dock menu with jqDock!
Why have you deleted my post? It was very useful information and i guarantee atleast 1 person found it helpful unlike the rest of the comments on this site. I’ll post it again. Sick and tired of getting low amounts of useless visitors to your website? Well i want to tell you about a fresh underground tactic which makes me personally $900 daily on 100% AUTOPILOT. I possibly could be here all day and going into detail but why dont you simply check their website out? There is really a excellent video that explains everything. So if your seriously interested in producing hassle-free money this is the site for you. Auto Traffic Avalanche
Why have you taken out my post? It was very helpful information and i guarantee atleast 1 person found it helpful unlike the rest of the comments on this website. I’ll post it again. Fed up with obtaining low amounts of useless visitors for your website? Well i want to tell you about a new underground tactic which makes me personally $900 each day on 100% AUTOPILOT. I could truthfully be here all day and going into detail but why dont you simply check their website out? There is really a great video that explains everything. So if your seriously interested in producing hassle-free cash this is the site for you. Auto Traffic Avalanche
My name is Theo Stråhlén and I'm a flash and javascript developer, currently studying the Digital Media program at Hyper Island in Karlskrona.
I'm always hungry to learn new things and I feel inspired when I'm around creative people. I'm available for a 7 month internship from November 2010 – June 2011.
alarm as3 blog concept developer dock domani freelance group dynamics hyper island industry info Inspiration internship invite jqdock jquery live lufthansa lvl3 menu mobile new york php plugin profero roskilde site social social media spotify technology thexv twitter whatisxv world cup
Monday, August 30, 2010
Sick of obtaining low amounts of useless traffic for your website? Well i wish to let you know about a new underground tactic that produces myself $900 per day on 100% AUTOPILOT. I possibly could be here all day and going into detail but why dont you simply check their site out? There is a excellent video that explains everything. So if your seriously interested in producing easy cash this is the site for you. Auto Traffic Avalanche