bit of javascript for better navigation

Ok, I don't like the fact that I can't edit my initial issues here, but here's a little update.

To make the title color Orange (I use Rootcandy Dark) when hovering the li, just use this piece of javascript:

$(document).ready(function(){

				$('.admin-menu-compact li').css('cursor', 'pointer').click(function() {
					location.href=($('a', this).attr('href'));
					return false;
				}).hover(function() {
					$(this).addClass('adminHover');
				}, function() {
					$(this).removeClass('adminHover');
				});	
				
});

And place this piece of css somewhere:

.adminHover a
{
  color:#F27B00;
}

Cheers,
Danny

www.dannyjoris.be

Hey sign. With css would even be better indeed.

I tried your code and the hover didn't work quite well (see attachment)

I tweaked it a bit and it works for me but has flaws with large titles. (see attachment) If you want me to, I'll look at it more. Just to make sure we're not doing the same thing.

ul.admin-menu-compact a:hover {
background-color:#FFFFFF;
border:1px solid silver;
height:75px;
margin-left:-6px;
margin-top:-6px;
padding-top:25px;
width:120px;
}

CamStudio + Photoshop to cut the .avi in length and size and to transfer it to .gif. It's quite a hassle, but I'm trained to do it quick :) http://sourceforge.net/projects/camstudio/ It's best to keep it small as Photoshop can't handle big animated .gif's sometimes.

I had the same result on firefox 3.5.x and on safari.

btw the borders on hover are breaking it

Your css or mine?

Not to cause confusion but could you check if you have the same issue here?

I made the borders of the li.leaf red, and I noticed that there are some lost li's with the .last class on it. And it causes some css issues. Maybe it's me, because I've been tweaking that thing for a while, and sometimes I get a bit lost in what I'm doing... :)

Well, I guess I could easily make a 10px out of this, but then the .last class would not be of any use.

ul.admin-menu-compact li.last {
  margin-right: 0;
}

Still working on the css issue.

I think I've fixed it. I messed around a bit till it looked good. I moved the padding from the li.leaf to the 'a' and 'a:hover'. They both have 10px padding on left and right side, if that's ok. I temporarily changed the li.last to 10 padding.

See, I'm not a developer and sometimes I feel kinda bad throwing around all these requests in issue queue's. So I'm happy that I can give something small back in my own way.

ul.admin-menu-compact li.leaf {
  border:1px solid #fff;
  float:left;
  height:105px;
  list-style-image:none;
  list-style-position:outside;
  list-style-type:none;
  margin-bottom:10px;
  margin-right:10px;
  padding:0;
  text-align:center;
  width:130px;
}

ul.admin-menu-compact li.last {
  margin-right: 10;
}

ul.admin-menu-compact a {
  display:block;
  height:80px;
  padding:20px 10px 5px;
  text-decoration:none;
  width:110px;
}

ul.admin-menu-compact a:hover {
  background-color:#FFFFFF;
  border:1px solid silver;
  height:80px;
  margin-left:-1px;
  margin-top:-1px;
  padding:20px 10px 5px;
  width:110px;
}

Thanks very much, Sign!
Cheers,
Danny

--Edit: tested in FF 3.5.x, Safari for vista and IE7

By the way, check this out: http://www.jingproject.com/ :)

By coincidence I just found it and its so much better than recording an .avi and then transferring it to .gif with Photoshop.

With Jing you record your screen (in a better frame and with optional audio), and you can even make a custom button to immediately send it to your own server. + it copies an url to your clipboard so you can immediatly paste the location of that newly uploaded file into a post or msn or whatever. The free version renders it to .swf, which is cool enough.

As an example: I made, uploaded and pasted this literally within 2 minutes : http://dannyjoris.be/files/fora/hover_example.swf

Cheers,
Danny