Bildlauf und Mouseovereffekt

[waldquell]

Hallöchen ihr Lieben,

ich möchte mich kurz fassen, sonst wirds nen Roman ;-)


Auf meiner Page (noch nicht hochgeladen), habe ich ganz rechts ein paar Bider, welche von oben, nach unten laufen. Java-Bildlauf eben.
Mit einem Mouseovereffekt wird das treffende Bild auf eine bestimmte Größe rechts vergrößert.

Probem ist aber, dass sich die Bilder ganz rechts befinden, und somit ein Scrollbalken rechts entsteht, der nichts dort zu suchen hat.
Grund dafür ist, dass sich die Bilder beim Mouseover immer nach rechts hin öffnen.

Mein Vorhaben ist es, dass sie sich nach links hin öffnen, sobald ich mit der Mouse darüber fahre.
Dies geht aber nur, wenn ich beim Java-Bildlauf den Slide (worauf sich die Bilder befinden) nach links setze, anstatt, wie momentan, rechtshin.
Etwas omisch ausgedrückt, ich versuchs mal mit paar AsciiZeichen:

B####
I####
L####
D####
L####
A####
U####
F####

Der Slide (#) geht nach rechts, will ihn aber links haben, so, dass sich die Bilder während des Mouseover auch linksweg öffnen lassen.

Komischerweise bin ich zu blöd oder blind es hinzubekommen.
Vielleicht kann mir jemand einen Stups oder Tip geben ?!

Quelltext:
[Java] <script type='text/javascript'>
<!--
var sliderwidth = 800; // Breite
var sliderheight = 450; // Höhe
var slidespeed = 1; // Geschwindigkeit
var slidebgcolor = ""; // Hintergrundfarbe
var slidedir = "runter"; //
var leftrightslide = new Array();
var copyspeed = slidespeed;
var i = 0;

/* Bilder*/
leftrightslide[i++] = '<div><a class="images" href="#"><img src="../img/nessy1.JPG"></a></div>';
leftrightslide[i++] = '<div><a class="images" href="#"><img src="../img/nessy2.JPG"></a></div>';


/* AB HIER NICHTS MEHR ÄNDERN */
leftrightslide = leftrightslide.join("");
var iedom = document.all || document.getElementById;
if (iedom)
document.write('<span id="temp" style="visibility:hidden;position:absolute;left:-100px;top:-3000px">' + leftrightslide + '</span>');
var actualheight = '';
var cross_slide, ns_slide;

function fillup(){
if (iedom){
cross_slide=document.getElementById? document.getElementById("test2") : document.all.test2;
cross_slide2=document.getElementById? document.getElementById("test3") : document.all.test3;
cross_slide.innerHTML=cross_slide2.innerHTML=leftrightslide;
actualheight=document.all? cross_slide.offsetHeight : document.getElementById("temp").offsetHeight;
cross_slide2.style.top=actualheight+20+"px";
}
else if (document.layers){
ns_slide=document.ns_slidemenu.document.ns_slidemenu2;
ns_slide2=document.ns_slidemenu.document.ns_slidemenu3;
ns_slide.document.write(leftrightslide);
ns_slide.document.close();
actualheight=ns_slide.document.height;
ns_slide2.top=actualheight+20;
ns_slide2.document.write(leftrightslide);
ns_slide2.document.close();
}
if ( slidedir == "hoch" ) {
lefttime=setInterval("slidetop()",30);
} else {
lefttime=setInterval("slidedown()",30);
}
}
function slidetop(){
if (iedom){
if (parseInt(cross_slide.style.top)>(actualheight*(-1)+8))
cross_slide.style.top=parseInt(cross_slide.style.top)-copyspeed+"px";
else
cross_slide.style.top=parseInt(cross_slide2.style.top)+actualheight+"px";

if (parseInt(cross_slide2.style.top)>(actualheight*(-1)+8))
cross_slide2.style.top=parseInt(cross_slide2.style.top)-copyspeed+"px";
else
cross_slide2.style.top=parseInt(cross_slide.style.top)+actualheight+"px";
}
else if (document.layers){
if (ns_slide.top>(actualheight*(-1)+8))
ns_slide.top-=copyspeed;
else
ns_slide.top=ns_slide2.top+actualheight;

if (ns_slide2.top>(actualheight*(-1)+8))
ns_slide2.top=copyspeed;
else
ns_slide2.top=ns_slide.top+actualheight;
}
}

function slidedown(){
if (iedom){
if (parseInt(cross_slide.style.top)<(actualheight-8))
cross_slide.style.top=parseInt(cross_slide.style.top)+copyspeed+"px";
else
cross_slide.style.top=parseInt(cross_slide2.style.top)-actualheight+"px";

if (parseInt(cross_slide2.style.top)<(actualheight-8))
cross_slide2.style.top=parseInt(cross_slide2.style.top)+copyspeed+"px";
else
cross_slide2.style.top=parseInt(cross_slide.style.top)-actualheight+"px";
}
else if (document.layers){
if (ns_slide.top>(actualheight*(-1)+8))
ns_slide.top-=copyspeed;
else
ns_slide.top=ns_slide2.top+actualheight;

if (ns_slide2.top>(actualheight*(-1)+8))
ns_slide2.top=copyspeed;
else
ns_slide2.top=ns_slide.top+actualheight;
}
}

if (iedom||document.layers){
with (document){
document.write('<table border="0" cellspacing="0" cellpadding="0"><td>');
if (iedom){
document.write('<div style="position:relative;width:' + sliderwidth + 'px;height:' + sliderheight + 'px;overflow:hidden">');
document.write('<div style="position:absolute;width:' + sliderwidth + 'px;height:' + sliderheight + 'px;background-color:' + slidebgcolor + '" onmouseover="copyspeed=0" onmouseout="copyspeed=slidespeed">');
document.write('<div id="test2" style="position:absolute;left:0;top:0"></div>');
document.write('<div id="test3" style="position:absolute;top:-1000;left:0"></div>');
document.write('</div></div>');
}
else if (document.layers){
document.write('<ilayer width='+sliderwidth+' height='+sliderheight+' name="ns_slidemenu" bgColor='+slidebgcolor+'>');
document.write('<layer name="ns_slidemenu2" left=0 top=0 onmouseover="copyspeed=0" onmouseout="copyspeed=slidespeed"></layer>');
document.write('<layer name="ns_slidemenu3" left=0 top=0 onmouseover="copyspeed=0" onmouseout="copyspeed=slidespeed"></layer>');
document.write('</ilayer>');
}
document.write('</td></table>');
}
}
//-->
</script> [/Java]


Liebe Grüße,
Waldi =D

 

[hartzie]

Zu aller erst falsches Forum...

Aber um dir zu helfen:

Es ist leicht schwierig dein Problem zu verstehen, wenn du es mit Worten versuchst. Bilder sagen mehr als tauasend Worte... Lade doch einmal ein Bild hoch und zeig mal was da wie aussieht.

 

[waldquell]

Falsches Forum ? Mist ^^
Entschuldige ;-)


Das Weiße ist wie gesagt der Slide. Ich möchte, dass die Bilder ganz rechts im Slide sind, so, dass sie sich mit dem Mouseover nach linksweg öffnen ;-)

 

[eRaaaa]

*verschoben*

Java != Javascript!

 

[hartzie]

Das scheint mir nichtmal nach einem Javascript Problem sondern eher einfache Mathematik . Du setzt einfach die falschen Koordinaten für das große Bild. Mal dir das mal auf Papier auf und überlege mit welchen Variablen du das bild an die gewünschte Position kriegst.

 

[waldquell]

Ah ok,

ich hab jetzt etwas "rumgespielt" und den Bildlauf in die Mitte gepackt.
Bilder öffnen sich nun auch nach links.

Aber Problem:
Bilder lassen sich nur innerhalb des "Slides" anzeigen, ist das Bild größer, wirds einfach abgeschnitten.
Ich muss den Slide also vergrößern, aber nach links.

Wie vergrößere ich den Slide nach links ?

 

[hartzie]

Wie hast du das denn gelöst das es überhaupt über allem also als "overlay" angezeigt wird? Mit einem Z-index?