zurück zur Startseite
  


Zurück XHTMLforum > Webentwicklung (außer XHTML und CSS) > Javascript & Ajax
Seite neu laden Rollover

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 30.09.2011, 14:29
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 30.09.2011
Beiträge: 5
seric befindet sich auf einem aufstrebenden Ast
Standard Rollover

Hallo,

wie bekomme ich so einen Effekt hin. Gibt es da etwas fertiges zu.

Es geht um den Rollover-Effekt wenn man auf die Thumbnails in der Gallery geht. Also Farbe einblenden mit Text und leicht durchsichtig.

Awwwards | The CSS website Awards

Vielen Dank!
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 30.09.2011, 15:23
Benutzerbild von Chris2011
Erfahrener Benutzer
XHTMLforum-Mitglied
 
Registriert seit: 04.01.2011
Beiträge: 301
Chris2011 befindet sich auf einem aufstrebenden Ast
Standard

das Bild ändert sich bloß glaube ich
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 30.09.2011, 15:25
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 30.09.2011
Beiträge: 5
seric befindet sich auf einem aufstrebenden Ast
Standard

glaube nicht das die für jeden neuen Beitrag ein neues Bild mit Text erstellen ich denke der Text darauf ist kein Bild?!
Mit Zitat antworten
  #4 (permalink)  
Alt 30.09.2011, 17:42
Benutzer
neuer user
 
Registriert seit: 26.04.2010
Beiträge: 75
moontan befindet sich auf einem aufstrebenden Ast
Standard

Den Text findest Du ja in den spans:

HTML-Code:
<div class="date">
                        <span class="day">30</span>
                        <span class="month">Sep</span>
                        <span class="year">2011</span>
                    </div>
Das abdunkeln ist ein png - der Rest - ich vermute es wird einfach beim hover der z-index der Elemet verändert.

uli
Mit Zitat antworten
  #5 (permalink)  
Alt 02.10.2011, 21:28
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 30.09.2011
Beiträge: 5
seric befindet sich auf einem aufstrebenden Ast
Standard

irgendwie komme ich nicht weiter. gibt es ein Tutorial zu dem Thema oder ähnliches.

Hier ein kurzes video wie ich es mir vorstelle
Export_20111002-202156.mov (1,85 MB) - uploaded.to

Danke!
Mit Zitat antworten
  #6 (permalink)  
Alt 02.10.2011, 21:50
Benutzerbild von Thielo
Web Ninja
XHTMLforum-Kenner
 
Registriert seit: 17.09.2009
Ort: Stuttgart oder so
Beiträge: 3.372
Thielo ist ein LichtblickThielo ist ein LichtblickThielo ist ein LichtblickThielo ist ein LichtblickThielo ist ein LichtblickThielo ist ein Lichtblick
Standard

Folgender (logischer) Aufbau (nur eine Möglichkeit von vielen!):

HTML-Code:
<ul>

	<li>
		<a href="#">
			<span class="infos">
				<strong>Hier könnte der Titel stehen</strong>
				<span class="innerText">Hier könnte jetzt Ihr Text stehen!</span>
			</span>
			<img src="grafik.jpg" alt="Alt-Dingens" />
		</a>
	</li>
	
	<li>
		<a href="#">
			<span class="infos">
				<strong>Hier könnte der Titel stehen</strong>
				<span class="innerText">Hier könnte jetzt Ihr Text stehen!</span>
			</span>
			<img src="grafik.jpg" alt="Alt-Dingens" />
		</a>
	</li>
	
</ul>
Dahinterstehende Logik: das li bekommt ein overflow: hidden, das span "infos" und das Bild werden mit position und Z-index übereinander gelegt. und per Javascript "fährt" das span runter und hoch.

Soweit der Denkanstoß für dich.
__________________
Hier ein immer gültiges Statement: Überarbeite deine Code, lerne die Grundlagen, widersprich mir nicht, wehre dich nicht, ich habe Recht, wir sind Lolgion, wir sind viele.. potato...
All meine Angaben sind ohne Gewähr, es könnte also trotz meiner Unfehlbarkeit dazu kommen dass ich falsch liege

www.richard-thiel.de | Müssen Websiten überall gleich ausschauen?
Mit Zitat antworten
Antwort

Themen-Optionen
Ansicht

Forumregeln
Es ist Ihnen nicht erlaubt, neue Themen zu verfassen.
Es ist Ihnen nicht erlaubt, auf Beiträge zu antworten.
Es ist Ihnen nicht erlaubt, Anhänge hochzuladen.
Es ist Ihnen nicht erlaubt, Ihre Beiträge zu bearbeiten.

BB-Code ist an.
Smileys sind an.
[IMG] Code ist an.
HTML-Code ist aus.
Trackbacks are an
Pingbacks are an
Refbacks are aus


Ähnliche Themen
Thema Autor Forum Antworten Letzter Beitrag
horizontale Navigation mit rollover Bild c3ox CSS 3 28.11.2009 01:06
Rollover breiter als das li moros CSS 3 16.12.2008 16:13
Rollover und Dropdown? Der Buß CSS 0 23.08.2008 18:09
ie verliert Abstand bei Rollover bene CSS 2 22.09.2006 21:12
RollOver wirkt sich auf 2 Dinge aus! Wie...? Bossanova68 CSS 3 16.08.2006 12:49


Alle Zeitangaben in WEZ +2. Es ist jetzt 03:43 Uhr.