webmaster resource
+ Webmaster Forum von Webmaster-Resource.de » Webcoding » HTML, CSS und Javascript (Moderator: Christian Felken)
|-+ HTML-Tabelle mit mouseover vergrößern
Username:
Password:

Seiten: [1]
Topic Tools  
Read 02. November 2007, 11:51:51 #0
Dziko

HTML-Tabelle mit mouseover vergrößern

Hallo zusammen,

ich wollte für mein Newssystem eine ähnliche Idee wie unter www[dot]web[dot]de verwenden.
Wenn man über eine Tabelle fährt das diese sich dann samt Inhalt (Bilder+Schriftgröße) vergrößert.

Wie kann man sowas realisieren? Ich dachte vieleicht an eine Lösungsmöglichkeit mit css?

viele Grüße
André  Smiley
Offline  
Read 02. November 2007, 13:12:20 #1
» тнє $υι¢ι∂є « ™

Re: HTML-Tabelle mit mouseover vergrößern

onmouseover ....


Offline  
Read 03. November 2007, 11:20:59 #2
sf-design

Re: HTML-Tabelle mit mouseover vergrößern

Jep, mit JavaScript ist das gar nicht mal so schwierig. Unter Umständen ließe sich das vielleicht sogar noch mit CSS lösen.

Aber mit JS machst du dann einfach eine Funktion, die die angewählte Zeile vergrößert und alle anderen wieder in ihren Ursprungszustand zurücksetzt.


Offline  
Read 12. November 2007, 20:45:05 #3
Dziko

Re: HTML-Tabelle mit mouseover vergrößern

Ok vielen Dank, werde mich dann doch leider mehr mit JS auseinandersetzen müssen!  Schockiert

viele Grüße
Dziko  Zwinkernd
Offline  
Read 09. Dezember 2007, 00:19:27 #4
Daniel

Re: HTML-Tabelle mit mouseover vergrößern

Du musst dazu den className der Tabelle ändern und alle TAGS in der Tabelle müssen dieser klasse unterstelltsein:

CSS:
Code:
.tabelle
{
width:300px
}
.tabelle td
{
height:10px;
font-size:10pt;
}
.tabelle_over
{
width:600px
}
.tabelle_over td
{
height:20px;
font-size:20pt;
}


HTML - JS
Code:
<table onmouseover="this.className='tabelle_over';" onmouseout="this.className='tabelle';" class="tabelle">
<tr>
<td>INHALT</td>
</tr>
</table>


Offline  
Read 16. Dezember 2007, 17:46:12 #5
Dziko

Re: HTML-Tabelle mit mouseover vergrößern

vielen Dank, das funktioniert! Genau das hatte ich gesucht!

viele Grüße
Offline  
Seiten: [1]
Gehe zu: