Extremefall
Mitglied
Hallo,
ich arbeite an einer Scrollbar. Leider ist die Höhe nicht gleich der Höhe, die durch den Mouseover Effekt entsteht.
Hier einmal mein Code:
Wie kann ich nun für die Liste bzw. das DIV eine feste Höhe und Breite festlegen? Hier ein Beispiel:
http://vision-sportal.de/scrollbar.html
Rechts ist dann der Scrollbalken zu finden. Wie bekomme ich es hin, dass am Anfang das DIV die gleiche Höhe hat, wie nach dem Scrollen?
ich arbeite an einer Scrollbar. Leider ist die Höhe nicht gleich der Höhe, die durch den Mouseover Effekt entsteht.
Hier einmal mein Code:
HTML:
<html>
<head>
<style type="text/css">
p, div {
padding: 0;
margin: 0;
}
#listcontent{
display: block;
width: 200px;
min-width: 200px;
list-style: none;
position: absolute;
}
.scroller {
float: right;
width: 10px;
}
.scroller .arrow {
border: 1px solid black;
cursor: pointer;
padding: 4px;
}
.scroller .bar {
height: 50px;
margin: 2px;
border: 1px solid black;
padding: 0 2px;
} </style>
</head> <body>
<div class="scroller">
<p class="arrow" onmouseover="scroll.start(-10)" onmouseout="scroll.stop()" title="Nach oben"></p>
<p class="bar"></p>
<p class="arrow" onmouseover="scroll.start(10)" onmouseout="scroll.stop()" title="Nach unten"></p>
</div> <ul id="listcontent" style="overflow: visible;height: 200px; min-height: 200px;padding-top: 30px;padding-bottom: 30px;" class="liste">
<li>Lithops hallii</li>
<li>Lithops hallii v. hallii "salicola reticulata"</li>
<li>Lithops hallii v. hallii (brown form)</li>
<li>Lithops hallii v. hallii (white)</li>
<li>Lithops hallii v. ochracea</li>
<li>Lithops helmutii</li>
<li>Lithops helmutii 'Albiflos' ex Fritz</li>
<li>Lithops herrei</li>
<li>Lithops herrei "translucens"</li>
<li>Lithops hookeri v. hookeri (vermiculate)</li>
<li>Lithops hookeri v. dabneri</li>
<li>Lithops hookeri v. elephina</li>
<li>Lithops hookeri v. hookeri</li>
<li>Lithops hookeri v. hookeri (vermiculate form)</li>
<li>Lithops hookeri v. hookeri (vermiculate)</li>
<li>Lithops hookeri v. lutea</li>
<li>Lithops hookeri v. marginata</li>
<li>Lithops hookeri v. marginata </li>
<li>Lithops hookeri v. marginata (cerise form)</li>
<li>Lithops hookeri v. marginata (red-brown form)</li>
<li>Lithops hookeri v. subfenestrata</li>
<li>Lithops hookeri v. subfenestrata "brunneoviolacea"</li>
<li>Lithops hookeri v. susannae</li>
<li>Lithops julii ssp. fulleri v. brunnea</li>
<li>Lithops julii ssp. fulleri v. fulleri</li>
<li>Lithops julii ssp. fulleri v. fulleri 'Fullergreen'</li>
<li>Lithops julii ssp. fulleri v. fulleri 'Fullergreen × Malachite'</li>
<li>Lithops julii ssp. fulleri v. rouxii</li>
<li>Lithops julii ssp. julii</li>
<li>Lithops julii ssp. julii "chrysocephala"</li>
<li>Lithops julii ssp. julii "littlewoodii"</li>
<li>Lithops julii ssp. julii (reticulate)</li>
<li>Lithops karasmontana</li>
<li>Lithops karasmontana ssp. bella</li>
<li>Lithops karasmontana ssp. bella (dark form)</li>
<li>Lithops karasmontana ssp. eberlanzii</li>
<li>Lithops karasmontana ssp. eberlanzii "erniana witputzensis"</li>
<li>Lithops karasmontana ssp. eberlanzii "erniana"</li>
<li>Lithops karasmontana ssp. karasmontana v. aiaisensis</li>
<li>Lithops karasmontana ssp. karasmontana v. karasmontana</li>
<li>Lithops karasmontana ssp. karasmontana v. karasmontana "erniana"</li>
<li>Lithops karasmontana ssp. karasmontana v. karasmontana "jacobseniana"</li>
<li>Lithops karasmontana ssp. karasmontana v. karasmontana "lateritia"</li>
<li>Lithops karasmontana ssp. karasmontana v. karasmontana "mickbergensis"</li>
<li>Lithops karasmontana ssp. karasmontana v. karasmontana "opalina"</li>
<li>Lithops karasmontana ssp. karasmontana v. karasmontana "opalina" (from pure white plants)</li>
<li>Lithops karasmontana ssp. karasmontana v. karasmontana (brick-red)</li>
<li>Lithops karasmontana ssp. karasmontana v. karasmontana (orange)</li>
<li>Lithops karasmontana ssp. karasmontana v. karasmontana (Signalberg form)</li>
<li>Lithops karasmontana ssp. karasmontana v. karasmontana (Signalberg form, excellent markings)</li>
<li>Lithops karasmontana ssp. karasmontana v. karasmontana (top red)</li>
<li>Lithops karasmontana ssp. karasmontana v. lericheana</li>
<li>Lithops karasmontana ssp. karasmontana v. tischeri</li>
<li>Lithops karasmontana v. lericheana (red form)</li>
</ul>
<script src="scroll.class.js" type="text/javascript"></script>
<script type="text/javascript">
SCROLL = function(obj, attr) {
var interval;
var offset = {
'top': obj.offsetTop || 0,
'height': obj.offsetHeight || 0
}; this.start = function(amount) {
/* Default setzen */
attr.top = attr.top || 0;
attr.width = attr.width || "auto";
attr.height = attr.height || "auto"; /* Intervall starten */
interval = setInterval(
function() {
move(amount);
},
attr.time
);
}; this.stop = function() {
if (interval) {
clearInterval(interval);
}
}
function move(amount) {
/* Werte refreshen */
attr.top += amount;
attr.height += amount;
offset.top -= amount; /* Grenze überschritten? */
if (attr.top < 0 || attr.height > offset.height) {
attr.top -= amount;
attr.height -= amount;
offset.top += amount;
return;
} /* Object bewegen */
obj.style.clip = "rect(" + attr.top + "px " + attr.width + "px " + attr.height + "px 0)";
obj.style.top = offset.top + "px";
}
}
var scroll = new SCROLL(
document.getElementById('listcontent'),
{
'time': 60,
'width': 200,
'height': 200
}
);
</script>
</body>http://vision-sportal.de/scrollbar.html
Rechts ist dann der Scrollbalken zu finden. Wie bekomme ich es hin, dass am Anfang das DIV die gleiche Höhe hat, wie nach dem Scrollen?
