PSD-Tutorials.de
Forum für Design, Fotografie & Bildbearbeitung
Tutkit
Agentur
Hilfe
Kontakt
Start
Forum
Aktuelles
Besonderer Inhalt
Foren durchsuchen
Tutorials
News
Anmelden
Kostenlos registrieren
Aktuelles
Suche
Suche
Nur Titel durchsuchen
Von:
Menü
Anmelden
Kostenlos registrieren
App installieren
Installieren
JavaScript ist deaktiviert. Für eine bessere Darstellung aktiviere bitte JavaScript in deinem Browser, bevor du fortfährst.
Du verwendest einen veralteten Browser. Es ist möglich, dass diese oder andere Websites nicht korrekt angezeigt werden.
Du solltest ein Upgrade durchführen oder einen
alternativen Browser
verwenden.
Antworten auf deine Fragen:
Neues Thema erstellen
Start
Forum
Sonstiges
Webdesign, Webentwicklung & Programmierung
Webdesign: HTML/CSS, Responsive Design, Sass...
html/css-Code: Videos(-elemente) vergrößern (bei "mouseover" und/oder klick)
Beitrag
<blockquote data-quote="mindraper" data-source="post: 1938263" data-attributes="member: 115163"><p><strong>AW: html/css-Code: Videos(-elemente) vergrößern (bei "mouseover" und/oder klick)</strong></p><p></p><p>hi.</p><p></p><p>so, bevor du jetzt 10000x gesagt bekommst, du sollst den großen G befragen:</p><p>eine erklärung zum box model findest du einmal hier:</p><p><a href="http://www.w3.org/TR/CSS2/box.html" target="_blank">( ganz ausführlich )</a></p><p>oder hier:</p><p><a href="http://www.w3schools.com/css/css_boxmodel.asp" target="_blank">( einfacher gehalten )</a></p><p></p><p>im zuge dessen wirst du irgendwann auf ein fehlerhaftes verhalten des msie ( microsafts internet eskapade ähhh explorer ) stoßen, der das box model bis v8 ( bitte korrigieren falls falsch ) anders rendert als der rest der welt.</p><p></p><p>ein div-container ist das hier:</p><p><div></div></p><p></p><p>dass es dir um das video geht und nicht um das <object>-tag war mir schon klar <img src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7" class="smilie smilie--sprite smilie--sprite1" alt=":)" title="Smile :)" loading="lazy" data-shortname=":)" /> der inhalt des <object>-tags ( also das video ) orientiert sich in seiner größe aber logischerweise an den dimensionen des <object>-tags. d. h., du kannst eine videodatei mit einer kantenlänge von 6400px X 4800px in ein <object>-tag mit einer kantenlänge von 320px X 240px stecken, dem video ist das egal.</p><p>es wird aber immer nur mit 320px X 240px angezeigt werden, weil das umgebende <object>-tag ja nunmal diese größe hat. sinnbildlich gesprochen wird das video innerhalb des <object>-tags "zusammen gepresst" wenn es größer, bzw. "aufgeblasen" wenn es kleiner als dieses ist.</p><p></p><p>ein beispiel, um dir meinen theoretischen aufbau des letzten posts mal "vor augen zu führen":</p><p></p><p>HTML:</p><p>[HTML]</p><p><div class="container_for_video"></p><p> <object class="video" type="application/x-shockwave-flash"></p><p> <param name="movie" value="testflash.swf" /></p><p> <param name="play" value="false" /></p><p> <param name="quality" value="best" /></p><p> ...</p><p> </object></p><p></div></p><p>[/HTML]</p><p></p><p>CSS:</p><p>[CODE]</p><p>.container_for_video {</p><p> width: 400px;</p><p> height: 300px;</p><p>}</p><p></p><p>.container_for_video:hover {</p><p> width: 800px;</p><p> height: 600px;</p><p>}</p><p></p><p>.video {</p><p> width: 100%;</p><p> height: 100%;</p><p>}</p><p>[/CODE]</p><p></p><p>das ist allerdings – wie gesagt – ein gedankliches experiment, das ich persönlich nicht ausgetestet habe. einen versuch ist es allemal wert.</p><p></p><p>was gute bücher/lehrvideos/etc. angeht:</p><p></p><p>INET:</p><p>- <a href="http://de.selfhtml.org" target="_blank">selfhtml</a> – als kostenloses nachschlagewerk das A und O. für jeden.</p><p>- <a href="http://www.css4you.de" target="_blank">css4you</a> – ähnlich selfhtml, speziell für css.</p><p>- Google – der große G weiss ALLES. wie chuck norris <img src="/styles/default/xenforo/smilies/zwinker.gif" class="smilie" loading="lazy" alt=";)" title="Wink ;)" data-shortname=";)" /></p><p></p><p>BÜCHER:</p><p>ich persönlich finde die sachen von O'Reilly super, das ist aber geschmackssache. i. d. r. sind die aber vom inhaltlichen absolut top. ansonsten gibt es auch extrem viel von GalileoComputing. die sind m. E. nach bei speziellen sachen nicht so gut wie O'Reilly, für HTML und CSS aber auch einwandfrei.</p><p>am besten ist, in eine buchhandlung gehen und reinschauen. wenn dir der stil gefällt, in dem die bücher geschrieben sind und du verstehst was dort passiert, dann ist es schonmal gut. für HTML und CSS sind die meisten qualitativ so gut wie gleichwertig – zumindest nach meinen erfahrungen.</p><p></p><p>ein weiterer großer vorteil von büchern ist, dass du ohne probleme schnell nochmal nachschlagen kannst, wenn du etwas nicht wissen solltest oder vergessen hast. das geht meist auch schneller als in selfhtml o. ä. suchen, wenn du nicht ungefähr weisst, wo du das thema findest.</p><p></p><p>ein nachteil ist natürlich der preis. der kann u. U. relativ hoch sein. die beiden genannten verlage sind aber ihren preis an und für sich wert.</p><p></p><p>VIDEOS:</p><p>Video2Brain und GalileoComputing. beides gut. das von Waldfee erwähnte little boxes ist z.B. auch als video von Video2Brain erhältlich und wirklich gut. gar keine frage.</p><p></p><p>nachteilig ist natürlich auch hier der preis.</p><p></p><p></p><p>hoffe das hilft</p></blockquote><p></p>
[QUOTE="mindraper, post: 1938263, member: 115163"] [b]AW: html/css-Code: Videos(-elemente) vergrößern (bei "mouseover" und/oder klick)[/b] hi. so, bevor du jetzt 10000x gesagt bekommst, du sollst den großen G befragen: eine erklärung zum box model findest du einmal hier: [URL="http://www.w3.org/TR/CSS2/box.html"]( ganz ausführlich )[/URL] oder hier: [URL="http://www.w3schools.com/css/css_boxmodel.asp"]( einfacher gehalten )[/URL] im zuge dessen wirst du irgendwann auf ein fehlerhaftes verhalten des msie ( microsafts internet eskapade ähhh explorer ) stoßen, der das box model bis v8 ( bitte korrigieren falls falsch ) anders rendert als der rest der welt. ein div-container ist das hier: <div></div> dass es dir um das video geht und nicht um das <object>-tag war mir schon klar :) der inhalt des <object>-tags ( also das video ) orientiert sich in seiner größe aber logischerweise an den dimensionen des <object>-tags. d. h., du kannst eine videodatei mit einer kantenlänge von 6400px X 4800px in ein <object>-tag mit einer kantenlänge von 320px X 240px stecken, dem video ist das egal. es wird aber immer nur mit 320px X 240px angezeigt werden, weil das umgebende <object>-tag ja nunmal diese größe hat. sinnbildlich gesprochen wird das video innerhalb des <object>-tags "zusammen gepresst" wenn es größer, bzw. "aufgeblasen" wenn es kleiner als dieses ist. ein beispiel, um dir meinen theoretischen aufbau des letzten posts mal "vor augen zu führen": HTML: [HTML] <div class="container_for_video"> <object class="video" type="application/x-shockwave-flash"> <param name="movie" value="testflash.swf" /> <param name="play" value="false" /> <param name="quality" value="best" /> ... </object> </div> [/HTML] CSS: [CODE] .container_for_video { width: 400px; height: 300px; } .container_for_video:hover { width: 800px; height: 600px; } .video { width: 100%; height: 100%; } [/CODE] das ist allerdings – wie gesagt – ein gedankliches experiment, das ich persönlich nicht ausgetestet habe. einen versuch ist es allemal wert. was gute bücher/lehrvideos/etc. angeht: INET: - [URL="http://de.selfhtml.org"]selfhtml[/URL] – als kostenloses nachschlagewerk das A und O. für jeden. - [URL="http://www.css4you.de"]css4you[/URL] – ähnlich selfhtml, speziell für css. - Google – der große G weiss ALLES. wie chuck norris ;) BÜCHER: ich persönlich finde die sachen von O'Reilly super, das ist aber geschmackssache. i. d. r. sind die aber vom inhaltlichen absolut top. ansonsten gibt es auch extrem viel von GalileoComputing. die sind m. E. nach bei speziellen sachen nicht so gut wie O'Reilly, für HTML und CSS aber auch einwandfrei. am besten ist, in eine buchhandlung gehen und reinschauen. wenn dir der stil gefällt, in dem die bücher geschrieben sind und du verstehst was dort passiert, dann ist es schonmal gut. für HTML und CSS sind die meisten qualitativ so gut wie gleichwertig – zumindest nach meinen erfahrungen. ein weiterer großer vorteil von büchern ist, dass du ohne probleme schnell nochmal nachschlagen kannst, wenn du etwas nicht wissen solltest oder vergessen hast. das geht meist auch schneller als in selfhtml o. ä. suchen, wenn du nicht ungefähr weisst, wo du das thema findest. ein nachteil ist natürlich der preis. der kann u. U. relativ hoch sein. die beiden genannten verlage sind aber ihren preis an und für sich wert. VIDEOS: Video2Brain und GalileoComputing. beides gut. das von Waldfee erwähnte little boxes ist z.B. auch als video von Video2Brain erhältlich und wirklich gut. gar keine frage. nachteilig ist natürlich auch hier der preis. hoffe das hilft [/QUOTE]
Bilder bitte
hier hochladen
und danach über das Bild-Icon (Direktlink vorher kopieren) platzieren.
Zitate einfügen…
Authentifizierung
Wenn ▲ = 7, ▼ = 3, ◇ = 2 und die Summe von ▲ und ▼ durch ◇ geteilt wird, was ist das Ergebnis?
Antworten
Start
Forum
Sonstiges
Webdesign, Webentwicklung & Programmierung
Webdesign: HTML/CSS, Responsive Design, Sass...
html/css-Code: Videos(-elemente) vergrößern (bei "mouseover" und/oder klick)
Oben