Scrolling - IFrame

hey,
ich würde gerne den content ine inem Iframe per mousever zum scrolling lassen wollen…
aber nur horizentales scrolling
ALSO
LINKS UND RECHTS SIND PFEILE ZWISCHEN DEN PFEILEN LIEGT DER IFRAME DER ZIEMLICH LANG IST
auf den ersten blick sieht man 3 Bilder…wenn man auf das Rechte Pfeil(bild) mit der maus nur drüber geht sollte sich der inhalt bewegen und die wieteren bilder sollten sichbtar sein
aber bitte: sliding sollte eingebaut sein:)
und wenn man mit der maus weg vom bild ist sollte der inhalt auch stoppen…das selbe auf der anderen seite->LINKS beim linken bild/button sollte sich der inhalt nahc links bewegen.
ist das möglich…? ich bin mir sicher ich hab so etwas mal irgendwo geshene aber habs leider vergessen:(
danke

Das ist eine typische Anwendung für (deklarative) Animation,
wirklich funktionieren tut das bei einigen Programmen mit
SVG, sowas wie Bildergalerien lassen sich damit mit lediglich
mäßigem Aufwand realisieren.

Deklarative Animation von (X)HTML ist nicht so weit
fortgeschritten, soll angeblich beim MSIE unter sehr speziellen
Bedingungen funktionieren, nicht aber bei anderen gängigen
browsern. Andererseits gibt es da wieder Skriptlösungen, die
dort und für SVG die Angaben für die Animation umsetzen
können, sind dann allerdings vom Betrachter oder vom
Autor zusätzlich zu installieren.

Per Skript allein kann man sowas vermutlich auch machen, mit
den üblichen Problemen eben, die anwenderseitige Skripte mit
sich bringen, daher wurden ja auch Methoden spezifiziert und
standardisiert, wie man deklarativ animieren kann.

Bei allen drei Möglichkeiten empfiehlt sich derzeit allerdings,
eine schlichte (X)HTML-Alternative bereitzustellen, die den Inhalt
auch ohne Dynamik zugänglich macht, bei SVG kann man sich
das eventuell dann in ein bis drei Jahren sparen, weil es dann die
technisch aktuellen browser bei dem Format alle können.

hmm hast du ein scrip vorschlag?

Also praktisch ganz bestimmt nicht.
Ich beschäftigte mich eher mit deklarativer Animation, nicht mit
Skriptanimation ;o) Insofern sind meine Ideen auf Skripte bezogen
sehr theoretischer Natur und entbehren jeglicher praktischer
Erfahrung. Ich weiß, wie das DOM aufgebaut ist, weswegen ich
ungefähr abschätzen kann, was man machen können sollte, mehr
aber auch nicht, besonders nicht wie im Detail und in der Praxis.

Man kann mit Skripten doch über das DOM auf das CSS
zugreifen, somit auch auf top und left eines Elementes, die
Werte kann man ändern und somit verschiebt sich ein absolut
oder relativ oder fixed positioniertes Element. Man braucht vor
allem also keinen frame, der das alles ohnehin nur unnötig
verkompliziert und noch unzugänglicher macht. Besonders bei
einem Skript kann man die Werte ja einfach schrittweise
erhöhen, solange das Zeigegerät irgendein Objekt anklickert
oder wieder erniedrigen, wenn ein anderes Objekt angeklickert
wird. Bei Skriptanimationen ist das sogar einfacher als bei
deklarativer Animation, ist allerdings nicht kontinuierlich, sondern
immer in kleine Schritte zerlegt (ist ja letztlich alles digital, in
Skripten steht das dann aber wirklich immer schrittweise drin,
was die auch immer etwas unelegant und schlecht leserlich
macht).

Ich habe allerdings auch schon schrittweise Animationen mit
CSS :hover gesehen, die einen ähnlichen Effekt erzielen, also
etwa so wie ein Daumenkino, ist aber vom Quelltext her etwas
albern aufgebaut.

Moin,

wenn ich das richtig verstehe, sieht der Aufbau so aus:

<— (Pfeil nach links) | Bild (+ weitere versteckte Bilder) | (Pfeil nach rechts) —>

Wenn du nun auf <— klickst, soll sich das Bild nach links verschieben und das nächste Bild erscheinen. Wenn du auf —> klickst, soll das Ganze wieder rückgängig ablaufen.

Die Frage ist, ob man hierfür ein Lösung mit AJAX (also mit einer Gallerie und JS) hinbekommt bzw. mit dem Attribut , was allerdings keiner validen Programmierung entsprechen würde. Das Problem dabei ist, dass sich das Ganze ja innerhalb eines iFrames befindet. Bei einer AJAX Lösung müsste man auch den iFrame durch ein DIV austauschen können. (wobei hier interessant wäre, was passieren würde, wenn alle Bilder im DIV nebeneinander ausgerichtet wären und man das CSS-Attribut overflow einbringt, dass ja für einen Scrollbalken sorgen sollte).

Bisher nur ein paar Gedankenspielerein, aber eventuell helfen sie dir ja bzw. andere Mitdenker hier im Forum auf den richtigen Weg.

MfG
myPages

Nun, wenn der Nutzer den Rollbalken benutzen kann/darf, ist
das eigentlich relativ einfach, da braucht man nicht einmal
eine Animation oder ein Skript.

Man rechnet einfach die Breiten aller Bilder zusammen, die
packt man nebeneinander in ein div mit der Breite größer als
die Summe aller Bilderbreiten, dann werden die Bilder nicht
untereinander angeordnet, weil ja ausreichend Platz vorhanden
ist. Um dies div zieht man ein weiteres mit fester Breite, etwa
90% und sagt dazu overflow:auto.
Dann kann der Betrachter einfach den Rollbalken nutzen, um
willkürlich hin und her zu rollen.
Der Vorteil ist, daß sich die Bilder bei deaktiviertem CSS
automatisch brauchbar anordnen, also auch für diese Betrachter
anzeigbar bleiben, wenn die daran Interesse haben.
Der Aufwand an CSS ist zudem minimal, die Breite kann man ja
notfalls mit PHP ausrechnen lassen, wenn die Bilder stark
variieren oder einfach eine Breite schätzen, die auf jeden Fall
größer als notwendig ist.

das div müsste das auch so machen, oder?

CSS:

div#liste {
   width: 100%;
   overflow: auto;
}

div#liste img {
   display: inline;
   height: 150px:
}

DIV:

<div id="liste">
   <a href="img/bild1.jpg" target="pic" ><img src="thumb/bild1.jpg" /></a>
   <a href="img/bild2.jpg" target="pic" ><img src="thumb/bild2.jpg" /></a>
   <a href="img/bild3.jpg" target="pic" ><img src="thumb/bild3.jpg" /></a>
   <a href="img/bild4.jpg" target="pic" ><img src="thumb/bild4.jpg" /></a>
</div>

geht das so nicht?

zu myPages:das soll nicht nur ein BILD in der mitte sein ansonnst ist der rest richtig sondern genau 3
genauer:
3-video thubnails:beim anklicken erscheint dasd video in einem anderen frame durch target=“blabla”…das versteht ihr bestimmt naja links rechts ist insofern richtig geswesen wäre gut wenn das ganze auch noch "sliden würde"
ist das möglich?

Diese HipHopper :ps:

:smiley:
sag was xD
du bist hier der erfahrene :stuck_out_tongue:

michi7x7 - img ist bereits inline, das geht nur, wenn das div
drumherum ausreichend breit ist, sonst werden die nicht mehr
passenden Bilder in die nächste Zeile gesetzt.
Die 100% Breite bringen nichts, weil sich die auf das
Elternelement bezieht, also nichts mit den Bildern zu tun hat.

hoffmann - wäre gut wenn ichentwürfe wie es michi vorgeshclagen hat erhalten würde :stuck_out_tongue:

schon klar…aber overflow müsste doch höherrangig als inline sein, oder?

Das hat wenig miteinander zu tun, gibt reichlich Elemente vom
Typ inline: em, strong, var, a, b, q, i … - das bedeutet nur, daß
die innerhalb von Zeilen auftreten dürfen, nicht notwendig
innerhalb von genau einer Zeile. Die Zeilen werden aber
unabhängig davon meist bei Leerzeichen umgebrochen, wenn
die Breite nicht mehr reicht.
Daran wiederum könnte man was mit der Eigenschaft
whitespace drehen (pre, nowrap).

overflow wirkt erst, wenn eine Breite eines Blockelementes
fest vorgegeben ist und vom Inhalt etwas übersteht (nachdem
ein Zeilenumbruch probiert wurde oder wenn keiner möglich ist),
etwa wenn ein einzelnes Bild größer als die Breite ist - oder wenn
es zwischen den Bildern keine Leerzeichen (‘whitespace’) gibt,
dann könnte es auch klappen.

Ansonsten: bei dem img auch noch das Attribut alt vergessen ;o)

Probiers mal damit:

[code]

Divscrolling <
Text1 Text2 Text3 Text4 Text5 Text6 Text7 Text8 Text9 Text10 Text11 Text12 Text13 Text14 Text15 Text16 Text17 Text18 Text19 Text20
> [/code]

:smiley: danke Steditor GENAU! so wollte ich es haben vielen dank

kann man das gleiche nocheinmal amchen diesmal ohne links und rechts button das es automatisch scrollt und wenn man mit der maus übern content geht solls stoppen sonst einfach wieter nach rechts scrollen//alles wieder horitzontal also width sollte länger sein als height
wenn der content zu ende ist sollte sich das ganze einfach nochmal wiederholen
=> 1 2 3 4 5 6 7 8 9 1 2 3 4 5 6 7 8…
danke im voraus

edit: ichhab eben nachgedahct ob man das nicht einfach mit marquee machen könnte? das automtaische scroll geht ja zwar dmait sogar das städnige wiederholenw ie erwartet nur mit dem mouse over=Pause… :astonished:

Marquee gehört nicht mehr zum html standart.
Ich weiß nicht, wie man das fortlaufend gestalten kann, aber das hier würde einfach die Richtung umkehren:

[code]

Divscrolling
Text1 Text2 Text3 Text4 Text5 Text6 Text7 Text8 Text9 Text10 Text11 Text12 Text13 Text14 Text15 Text16 Text17 Text18 Text19 Text20
[/code]

wie kann ich die geschwindigkeit beeinflussen?
die ist nämlich rasend schnell erst lanbgsam
wenn ich irgendwie paar mal mti der maus drüber gehe und es stehen bliebt und wieder weg bin
ist sie voll schnell…
und kann man nciht machen dass das nciht alles wieder so rückwärtsläuft sondern so ähnlcihw ie bei marquee einfach sofort wiederholen…

Ich hab das jetzt noch ein bisschen vereinfacht, jetzt kannst du die Geschwindigkeit bei DX = 1; bzw. DELAY = 1; verändern. DX ist die Anzahl der Pixel, die pro Schritt weitergescrollt werden, DELAY ist die Zeit zwischen den Schritten in 1/1000 Sekunden.
DELAYEND legt die Zeit fest, die vor dem Umdrehen der Richtung gewartet wird, ebenfalls in 1/1000 Sekunden.
Wie man das fortlaufend gestalten kann, muss ich mir noch überlegen.

[code]

Divscrolling
Text1 Text2 Text3 Text4 Text5 Text6 Text7 Text8 Text9 Text10 Text11 Text12 Text13 Text14 Text15 Text16 Text17 Text18 Text19 Text20
[/code]