hilfe beim anpassen eines slide-effekts

[iRoybot]

Ich hab in einem Fotoblog ein Skript entdeckt welches Kommentare ein- bzw- ausblendet. Jetzt scheitere ich am anpassen des Skripts.
Im Original wird alles per js und image-maps gemacht, selbst das hovern der vor- und zurück-links. Ich hab also versucht alles bis auf den slide-effekt in reguläres html&css umzubauen.

Da ich mich mit js nicht auskenne, hätt ich gern gewußt wie ich die Höhe des Links (id=info) in dem Maß reduziere, wie der "geslidete" Inhalt (div mit id=comments) an höhe zunimmt.
Kenn mich mit der js-syntax leider nicht aus. Bitte um Hilfe od. Tips zur schreibweise.

Testseite ist hier: Link: http://www.contactsheet.de/test/index.php?id=54
Quelltext: view-source:http://www.contactsheet.de/test/index.php?id=54
(JS und CSS im head)

mfg iRoybot

[XaraX]

Hallo erstmal!

Da ich mich mit js nicht auskenne, hätt ich gern gewußt wie ich die Höhe des Links (id=info) in dem Maß reduziere, wie der "geslidete" Inhalt (div mit id=comments) an höhe zunimmt.

Jedes in document eingehangene und (potenziell)¹ sichtbare HTML-Objekt hat die Eigenschaften offsetHeight und offsetWidth, die sich auslesen lassen. In Deinem Beispiel also:

  
document.getElementById('slider').style.height=(document.getElementById('comments').offsetHeight + document.getElementById('info').offsetHeight)+'px'  

Gruß aus Berlin!
eddi

1. ein Element mit style.display='none' ist nicht sichtbar
      ein Element mit style.visibility='hidden' ist potenzell sichtbar

[iRoybot]

document.getElementById('slider').style.height=(document.getElementById('comments').offsetHeight + document.getElementById('info').offsetHeight)+'px'

hmm. Danke erstmal :) aber ich verstehs nicht
zu OffsetHeight sagt selfhtml "Speichert die Höhe eines Elements." bedeutet das nun, dass OffsetHeight lediglich die Höhe des Elements erkennt, oder dass es diese auf einen von mir vorgegebenen Wert festlegt?

Zu meinem Fall: war die Zeile von Dir zum besseren Verständnis gedacht, oder hätte Sie in meinem Script auch den von mir gewünschten Effekt? (der mittlere Link jetzt in magenta hervorgehoben) soll ja "weniger height erhalten"

zB: die funktion moveUp:
function moveUp(0,Pixelwert) {
  if(curPixels<390) {
    curPixels = curPixels + 30;
    if(curPixels>maxHeight) curPixels = maxHeight;
    document.getElementById('comments').style.height=curPixels + "px";
    return window.setTimeout("moveUp("+curPixels+","+maxHeight+")", 25);
  }
  document.getElementById('comments').style.overflow='auto';
  return;
}
so wie ich es interpretiere beginnt mit if(curPixels<390) die Schleife und return window.setTimeout... lässt das ganze erneut laufen (bis curPixel=maxHeight erreicht ist)

an welcher Stelle kann/muss ich nun eine neue Variable, ich nenn Sie mal AnchorHeight, definieren, und wie geb ich sie an meinen Link aus, damit 1) beides gleichzeitig passiert - div größer u. link kleiner und 2) es überhaupt klappt.

Kann ich einfach hinter "curPixels = curPixels + 30;" meine Zeile "AnchorHeight = get.ElementById('info').offsetHeight - 30; packen?
versteh ich dich richtig?

PS: danke für jeden Nachhilfe-Versuch ;-)

[XaraX]

Hallo erstmal!

zu OffsetHeight sagt selfhtml "Speichert die Höhe eines Elements." bedeutet das nun, dass OffsetHeight lediglich die Höhe des Elements erkennt, oder dass es diese auf einen von mir vorgegebenen Wert festlegt?

Dort wird die Dimension _gespeichert_ die das Element nach dem Rendern hat. Er ist, anders als .style.height, nur zum auslesen und nicht zum setzen der Dimension.

Zu meinem Fall: war die Zeile von Dir zum besseren Verständnis gedacht, oder hätte Sie in meinem Script auch den von mir gewünschten Effekt? (der mittlere Link jetzt in magenta hervorgehoben) soll ja "weniger height erhalten"

Es war auf den Beispiel gemünst und sollte, wenn keine Fehler entahlten sind, Dir direkt helfen.

so wie ich es interpretiere beginnt mit if(curPixels<390) die Schleife und return window.setTimeout... lässt das ganze erneut laufen (bis curPixel=maxHeight erreicht ist)

richtig

an welcher Stelle kann/muss ich nun eine neue Variable, ich nenn Sie mal AnchorHeight, definieren, und wie geb ich sie an meinen Link aus, damit 1) beides gleichzeitig passiert - div größer u. link kleiner und 2) es überhaupt klappt.

offengestandne stehe ich gerade auf dem Schlauch und weiß nicht, was Du meinst. Bitte erkläre nochmals, was zu tun ist.

Gruß aus Berlin!
eddi

[iRoybot]

Hallo erstmal!

ebenso :)

mein problem war nicht zu wissen ob der aufruf von
function1();
function2();
nacheinander abläuft. (ob ich deinen code, oder allgemein das verkleinern des links, in die bestehende funktion moveUp hineinpfriemeln muss, kann, soll, oder aber...
also, da ich deinen code leider nicht einzubauen bzw.  unterzubringen wusste, hab ich inzwischen zwei neue funktionen maxAnchor und minAnchor hinzugefügt (also einfach von moveUp und moveDown abgekupfert) vermutlich nicht so elegant, es mit zwei funktionen je onclick zu machen...)
aber immerhin: seltsamerweise klappt jetzt alles, wie es das soll (am localhost). is ja gar nicht so schwer, wenn man den code irgendwo "klauen" kann ;)

aber offsetHeight ist mal gespeichert ;) hab ich sicher nochmal irgendwann verwendung dafür. danke.