zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > CSS
Seite neu laden Bei Hover andere Klasse ansprechen

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 17.02.2011, 14:30
Legen..wait for it..dary
neuer user
Thread-Ersteller
 
Registriert seit: 17.02.2011
Ort: Wien
Beiträge: 13
Ravelux befindet sich auf einem aufstrebenden Ast
Standard Bei Hover andere Klasse ansprechen

Ich bin schon am verzweifeln!

Zur besseren Erklärung hier ein Bild:

Den Code kann ich leider nicht posten, da es firmenintern ist.

Ich möchte, dass wenn ich mit der Maus über das grüne, rote als auch das blaue Feld fahre, dass sich das grüne (ist bei mir derzeit background vom table) in eine Farbe ändert.
Jetzt kommt das aber!
Wenn ich mit der Maus über entweder das grüne, rote oder blaue Feld fahre soll sich nicht nur das grüne ändern sondern auch, dass das blaue eine andere Farbe bekommt.

Das rote Feld ist eigentlich egal da dort ein Bild sein wird.

Von dieser Art sollen dann 4 nebeneinander 'picken'.
Das ganze wird nämlich ein Slider.

Voraussetzung: Da wir nicht nur mit HTML arbeiten sondern ein "custom HTML" können wir kein mouseover verwenden (außer es muss wirklich sein, aber wir wollen es so gut wie möglich vermeiden)!

Ich hoffe ihr könnt mir weiterhelfen, da ich wirklich schon am verzweifeln bin.
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 17.02.2011, 14:42
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 28.01.2005
Beiträge: 11.779
fricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz sein
Standard

Zitat:
Zitat von Ravelux Beitrag anzeigen
Den Code kann ich leider nicht posten, da es firmenintern ist.
Verfass einen neutralen Testcase. Daran ist dann nichts "intern".
http://xhtmlforum.de/40080-f-r-frage...twortende.html

Sehr wahrscheinlich ist das aber kein CSS-"Problem" -- sondern ein Fall für JavaScript.
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 17.02.2011, 14:48
Legen..wait for it..dary
neuer user
Thread-Ersteller
 
Registriert seit: 17.02.2011
Ort: Wien
Beiträge: 13
Ravelux befindet sich auf einem aufstrebenden Ast
Standard

Zitat:
Zitat von fricca Beitrag anzeigen
sondern ein Fall für JavaScript.
Das dachte ich mir schon. In unserem CMS wo wir unser custom HTML mit eigenen Makros reinschreiben benutzen wir auch jquery.

Kennt wer vielleicht den Lösungsansatz wie ich vorgehen muss?
Ich werde gleich mal die Bilder und Texte durch was beliebiges ersetzen und den Code posten.

Aus meiner reinen Verzweiflung habe ich wahrscheinlich totalen Mist zusammengebastelt.
Mit Zitat antworten
  #4 (permalink)  
Alt 17.02.2011, 14:50
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 28.01.2005
Beiträge: 11.779
fricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz sein
Standard

Du musst prüfen, ob du mit Selektoren die gewünschten Elemente erreichen kannst.
Deshalb ist es auch völlig unmöglich, irgendwas dazu zu sagen, wenn man die Dokumentstruktur nicht kennt.

Und dann ist noch die Frage, in welchen Browsern das funktionieren soll.
Mit Zitat antworten
  #5 (permalink)  
Alt 17.02.2011, 14:54
Legen..wait for it..dary
neuer user
Thread-Ersteller
 
Registriert seit: 17.02.2011
Ort: Wien
Beiträge: 13
Ravelux befindet sich auf einem aufstrebenden Ast
Standard

Ist klar, dass es unmöglich ist
Bin schon am Code vorbereiten.

Zitat:
Zitat von fricca Beitrag anzeigen
Und dann ist noch die Frage, in welchen Browsern das funktionieren soll.
IE 6-8, Firefox
Mit Zitat antworten
  #6 (permalink)  
Alt 17.02.2011, 14:56
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 28.01.2005
Beiträge: 11.779
fricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz sein
Standard

Zitat:
Zitat von Ravelux Beitrag anzeigen
IE 6
Dann mach's mit JavaScript.
Mit Zitat antworten
  #7 (permalink)  
Alt 17.02.2011, 15:01
Legen..wait for it..dary
neuer user
Thread-Ersteller
 
Registriert seit: 17.02.2011
Ort: Wien
Beiträge: 13
Ravelux befindet sich auf einem aufstrebenden Ast
Standard

So, bitteschön:

HTML-Code:
<html>
<head>
	<title>
		Slider
	</title>
	
	<style type="text/css">
.slidertitle {
padding-top: 8px;
padding-left: 6px;
padding-bottom: 4px;
font-size: small;
line-height: 9pt;
font-weight: bold;
color:#d71f03;
}
.sliderpic {
padding-left: 6px;
padding-right: 6px;
}
.sliderlink {
padding-left: 6px;
font-size: small;
font-weight: bold;
}
	.sliderlink a {
	padding-left: 3px;
	color: #000;
	text-decoration: none;
	}
	.sliderlink a:hover {
	text-decoration: underline;
	}
td.sliderhover:hover {
background-color: #f1d414;
}

.whiteborder {
border-color:#fff; 
outline: 1px solid white;
}
.greybg {
background-color: #ddd;
background-position: 10px;
}
	</style>
<script src="http://code.jquery.com/jquery-1.5.js"></script>
</head>

<body bgcolor="#d5d5d5">	
<script>
$("sliderhover")
.hover(
  function () {
    $(this).toggleClass("active")
      .next().stop(true, true).slideToggle();
  }
);


</script>



<table style="margin-top: -10px;" border="0" align="center" cellpadding="0" cellspacing="0">
	<tr>
		
<td class="sliderhover">
	<table border="0" cellpadding="0" cellspacing="0">
		<tr>
			<td class="slidertitle">TEXT <br>TEXT</td>
		</tr>
		<tr>
			<td class="sliderpic"><img class="whiteborder" src="images/1_active.gif"></td>
		</tr>
		<tr>
			<td class="sliderlink"><img src="images/arrow.gif"><a href="#1">TEXT</a></td>
		</tr>
		<tr>
			<td height="28px;">&nbsp;</td>
		</tr>
	</table>
</td>
<!-- Sliderbild 2 -->
<td class="sliderhover">
	<table cellpadding="0" cellspacing="0">
		<tr>
			<td class="slidertitle">TEXT <br>TEXT</td>
		</tr>
		<tr>
			<td class="sliderpic"><img class="whiteborder" src="images/2_active.gif"></td>
		</tr>
		<tr>
			<td class="sliderlink"><img src="images/arrow.gif"><a href="#1">TEXT</a></td>
		</tr>
		<tr>
			<td>&nbsp;</td>
		</tr>
	</table>
</td>
<!-- Sliderbild 3 -->
<td>
	<table cellpadding="0" cellspacing="0">
		<tr>
			<td class="slidertitle">TEXT <br>TEXT</td>
		</tr>
		<tr>
			<td class="sliderpic"><img class="whiteborder" src="images/3_inactive.gif"></td>
		</tr>
		<tr>
			<td class="sliderlink"><img src="images/arrow.gif"><a href="#1">TEXT</a></td>
		</tr>
		<tr>
			<td>&nbsp;</td>
		</tr>
	</table>
</td>
<!-- Sliderbild 4 -->
<td>
	<table cellpadding="0" cellspacing="0">
		<tr>
			<td class="slidertitle">TEXT <br>TEXT</td>
		</tr>
		<tr>
			<td class="sliderpic"><img class="whiteborder" src="images/4_inactive.gif"></td>
		</tr>
		<tr>
			<td class="sliderlink"><img src="images/arrow.gif"><a href="#1">TEXT</a></td>
		</tr>
		<tr>
			<td>&nbsp;</td>
		</tr>
	</table>
</td>


</tr>
</table>
			

</body>
</html>
Mit Zitat antworten
  #8 (permalink)  
Alt 17.02.2011, 15:05
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 28.01.2005
Beiträge: 11.779
fricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz sein
Standard

Quirksmodus.
Tabellenmissbrauch.
Mit den Bildern können wir nichts anfangen.
Der Zusammenhang zu deinem Bildchen und der Beschreibung oben ist nicht erkennbar.
Ich kann dir nicht helfen.

Außerdem: Siehe Vorposting. Du machst doch eh mit Scripten rum.
Mit Zitat antworten
  #9 (permalink)  
Alt 17.02.2011, 15:09
Legen..wait for it..dary
neuer user
Thread-Ersteller
 
Registriert seit: 17.02.2011
Ort: Wien
Beiträge: 13
Ravelux befindet sich auf einem aufstrebenden Ast
Standard

Ich weiss, dass es Tabellenmissbrauch geworden ist.
Der Abschnitt, der zu meiner Beschreibung eigentlich gehört ist der:

CSS:
Code:
.slidertitle {
padding-top: 8px;
padding-left: 6px;
padding-bottom: 4px;
font-size: small;
line-height: 9pt;
font-weight: bold;
color:#d71f03;
}
.sliderpic {
padding-left: 6px;
padding-right: 6px;
}
.sliderlink {
padding-left: 6px;
font-size: small;
font-weight: bold;
}
.sliderlink a {
padding-left: 3px;
color: #000;
text-decoration: none;
}
.sliderlink a:hover {
text-decoration: underline;
}
HTML:
HTML-Code:
<table cellpadding="0" cellspacing="0">
		<tr>
			<td class="slidertitle">TEXT <br>TEXT</td>
		</tr>
		<tr>
			<td class="sliderpic"><img class="whiteborder" src="http://xhtmlforum.de/images/2_active.gif"></td>
		</tr>
		<tr>
			<td class="sliderlink"><img src="http://xhtmlforum.de/images/arrow.gif"><a href="#1">TEXT</a></td>
		</tr>
		<tr>
			<td>&nbsp;</td>
		</tr>
</table>
Ja, ich bin aber sehr unerfahren was jquery angeht.


Eine Frage nebenbei: Kann man <div> nebeneinander positionieren ? Dann kann ich anstatt Tabellen einfach <div> benutzen.

Geändert von Ravelux (17.02.2011 um 15:13 Uhr)
Mit Zitat antworten
Sponsored Links
  #10 (permalink)  
Alt 17.02.2011, 15:14
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 28.01.2005
Beiträge: 11.779
fricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz sein
Standard

Es hat keinen Sinn.
Folge dem Link, den ich dir gepostet habe.

Du bist bei CSS mit deinem Anliegen falsch.

Zitat:
Eine Frage nebenbei: Kann man <div> nebeneinander positionieren ? Dann kann ich anstatt Tabellen einfach <div> benutzen.
Sorry, aber du bist offensichtlich nicht nur in jQuery unerfahren.
CSS-Grundlagen lernen: http://little-boxes.de/little-boxes-teil1-online.html
Mit Zitat antworten
Sponsored Links
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
Hilfe css Menu center xXcyberXx CSS 5 28.11.2010 20:51
Problem mit CSS Menü SMundt CSS 9 07.01.2009 20:12
CSS Navigation - Problem mit IE6 pcklinik CSS 4 18.09.2007 13:04
Darstellungsproblem CSS Navigation im IE7 pcklinik CSS 7 09.09.2007 18:25
CSS Einsteiger bittet um Hilfe pcklinik CSS 0 06.09.2007 15:40


Alle Zeitangaben in WEZ +2. Es ist jetzt 06:52 Uhr.