scrollbuttons added and small change for css (because i want it so!)

This commit is contained in:
Arthur Mayer 2011-03-17 15:43:28 +01:00
parent 105e2d1829
commit 954ab689e9
2 changed files with 44 additions and 6 deletions

View File

@ -418,6 +418,11 @@
background: url(images/scrollup.png) rgba(32,32,32,0.6);
margin-bottom: 4px;
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
-o-border-radius: 2px;
border-radius: 2px;
}
.panel .scrolldown {
@ -425,6 +430,11 @@
background: url(images/scrolldown.png) rgba(32,32,32,0.6);
margin-top: 4px;
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
-o-border-radius: 2px;
border-radius: 2px;
}
.panel .scrollup:hover, .panel .scrolldown:hover {
@ -454,11 +464,6 @@
background-repeat: no-repeat;
background-position: center;
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
-o-border-radius: 2px;
border-radius: 2px;
}
.playerlist {

View File

@ -182,13 +182,46 @@ DynMap.prototype = {
.appendTo(largeclock)
);
// The scrollbuttons
// we need to show/hide them depending: if (me.playerlist.scrollHeight() > me.playerlist.innerHeight()) or something.
var upbtn = $('<div/>')
.addClass('scrollup')
.bind('mousedown mouseup', function(event){
if(event.type == 'mousedown'){
playerlist.animate({"scrollTop": "-=300px"}, 3000, 'linear');
}else{
playerlist.stop();
}
});
var downbtn = $('<div/>')
.addClass('scrolldown')
.bind('mousedown mouseup', function(event){
if(event.type == 'mousedown'){
playerlist.animate({"scrollTop": "+=300px"}, 3000, 'linear');
}else{
playerlist.stop();
}
});
// The Player List
var playerlist;
$('<fieldset/>')
.append($('<legend/>').text('Players'))
.append(me.playerlist = playerlist = $('<ul/>').addClass('playerlist'))
.append(upbtn)
.append(me.playerlist = playerlist = $('<ul/>').addClass('playerlist')
.bind('mousewheel', function(event, delta){
this.scrollTop -= (delta * 10);
event.preventDefault();
})
)
.append(downbtn)
.appendTo(panel);
playerlist.height(sidebar.innerHeight() - (playerlist.offset().top - worldlist.offset().top) - 64); // here we need a fix to avoid the static value, but it works fine this way :P
$(window).resize(function() {
playerlist.height(sidebar.innerHeight() - (playerlist.offset().top - worldlist.offset().top) - 64); // here we need a fix to avoid the static value, but it works fine this way :P
});
// The Compass
var compass = $('<div/>')
.addClass('compass')