Wie gehts weiter ?

Status
Nicht offen für weitere Antworten.
U

ureich

Grünschnabel
Hallo,

ich habe habe ein Bild in PS erstellt, dann "ge-slice´t" und als html exportiert.
Wie bekomme ich nun ein Rollover Bild in eine dieser Zellen. Irgendwie kann ich das nicht einfügen, er zerschiesst mir meine Tabelle dabei.
Diese Tabelle hat doch als Hintergrund dieses Bild, was sich nie verändert. Es sollen kleine gif´s (als Rollover) in die Zellen eingefügt werden, die haben auch die gleiche Pixel grösse wie die Zelle.
Aber irgendwie setzt er die daneben ein und verschiebt die ganze Tabelle.

Wie geht das denn jetzt ?

Was mach ich falsch ?



Danke für Eure Hilfe

http://www.tor66.de/te/before.jpg
http://www.tor66.de/te/after.jpg
 
Zuletzt bearbeitet:
Hast Du evtl. auch noch ein wenig Quelltext zu Deinem Problem, an Hand dessen wir das Problem vielleicht besser erkennen können?

redlama
 
Hi ureich!

Grundsätzlich rate ich von Rollovern mit Bildern ab. Ich habe die Erfahrung damit gemacht, dass sie immer eine gewisse Zeit brauchen um zu laden und mich als User stört dies sehr wenn ich über einen Button gehe und mein Rechner dann lädt. Dabei scheint es wohl auch egal zu sein wie klein diese Grafiken sind oder ob man sie via Preloader lädt.
Mein Tipp daher: Mouseover mit CSS (siehe auf meiner Seite oder die Menüleiste links hier auf tutorials.de) oder du verwendest Flash um die Buttons zu erstellen. Beides schaut wesentlich besser aus als ein Tausch von Grafiken.

Liebe Grüße,
Manuel ;-]
 
hier mal der code:

Code: 
<html>
<head>
<title>navigation_5_nvlite_2</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script language="JavaScript" type="text/JavaScript">
<!--
function MM_swapImgRestore() { //v3.0
var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
}
function MM_preloadImages() { //v3.0
var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
	var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
	if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}
function MM_findObj(n, d) { //v4.01
var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
	d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
if(!x && d.getElementById) x=d.getElementById(n); return x;
}
function MM_swapImage() { //v3.0
var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}
//-->
</script>
</head>
<body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0" onLoad="MM_preloadImages('footage/switch_on.gif')">
<!-- ImageReady Slices (navigation_5_nvlite_2.psd) -->
<table id="Table_01" align="center" width="950" height="1050" border="0" cellpadding="0" cellspacing="0">
<tr>
<td colspan="3">
<img src="images/navigation_5_nvlite_3_01.gif" width="950" height="299" alt=""></td>
</tr>
<tr>
<td rowspan="10">
<img src="images/navigation_5_nvlite_3_02.gif" width="52" height="751" alt=""></td>
<td>
<img src="images/navigation_5_nvlite_3_03.gif" alt="" width="41" height="18" ><a href="#" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image14','','footage/switch_on.gif',1)"><img src="footage/switch_off.gif" name="Image14" width="41" height="18" border="0"></a></td>
<td rowspan="10">
<img src="images/navigation_5_nvlite_3_04.gif" width="857" height="751" alt=""></td>
</tr>
<tr>
<td>
<img src="images/navigation_5_nvlite_3_05.gif" width="41" height="4" alt=""></td>
</tr>
<tr>
<td>
<img src="images/navigation_5_nvlite_3_06.gif" width="41" height="18" alt=""></td>
</tr>
<tr>
<td>
<img src="images/navigation_5_nvlite_3_07.gif" width="41" height="3" alt=""></td>
</tr>
<tr>
<td>
<img src="images/navigation_5_nvlite_3_08.gif" width="41" height="18" alt=""></td>
</tr>
<tr>
<td>
<img src="images/navigation_5_nvlite_3_09.gif" width="41" height="4" alt=""></td>
</tr>
<tr>
<td>
<img src="images/navigation_5_nvlite_3_10.gif" width="41" height="18" alt=""></td>
</tr>
<tr>
<td>
<img src="images/navigation_5_nvlite_3_11.gif" width="41" height="5" alt=""></td>
</tr>
<tr>
<td>
<img src="images/navigation_5_nvlite_3_12.gif" width="41" height="18" alt=""></td>
</tr>
<tr>
<td>
<img src="images/navigation_5_nvlite_3_13.gif" width="41" height="645" alt=""></td>
</tr>
</table>
<!-- End ImageReady Slices -->
</body>
</html>

Warum nicht in PS/IR ? Gute Frage, machen das nicht alle so? Ausserdem ist man flexibler, vielleicht sollen die irgendwann einmal ausgetauscht werden, dann brauch ich ja nur die gif´s ändern.

Danke
 
@ShadowMan
Die Schalter müssen sein, die gehören zum grafischen Konzept einfach dazu.
(siehe Bilder)
Die sollten sich eigentlich beim "on klick" umlegen.
Die Lampe neben dem Schalter soll beim drüberfahren rot leuchten, beim klick soll der Schalter umlegen und die Lampe grün leuchten. Beim wechsel auf eine ander Seite soll alles wieder rückgängig gemacht werden.
Aber wie das gehen soll ist mir noch ein Rätsel. - Vorschläge - ? :)

Aber erstmal müssten die Buttons in der Tabelle Bleiben......


Danke
 
Hai,

dann brauch ich ja nur die gif´s ändern.
Zum Vergrößern anklicken....

genau. Darum ja auch alles in PS/IR (mach ich jedenfalls so). Der Quelltext steht, ob konform oder gut kann ich nicht beurteilen, und bei Bedarf lassen sich die gifs/jpegs austauschen.

Ciao Stefan

.. aber zu deinem Problem. Das geschilderte wirst du glaub ich mit Grafiken nicht hinbekommen. Java script und Flash sollten deine Freunde werden. :p
 
ich glaub auch...

deshalb müssen die rollover erstmal reichen !

Alles andere kann warten, jetzt soll es erstmal so gehen, mit dieser Tabelle.

Danke
 
Hi ureich!

Wie schonmal gesagt, um Flash wirst du da wirklich nicht rumkommen falls es unbedingt ein so "umständliches" Layout sein muss. Aber das ist ja Geschmackssache :)
Was meinst du eigentlich mit "einfach die gifs austauschen"? Wenn du die Buttons austauschst werden diese nicht mehr ins grafische Gesamtbild passen das du vorher erzeugt hast und daher wirst du das alles eh nochmals machen müssen.
Einen besonders realistischen Schalter bekommst du übrigens durch das Zusammenspiel von Flash mit einem 3d-Programm ;)

Lieben Gruß,
Manuel ;-]
 
Status
Nicht offen für weitere Antworten.

Neue Beiträge

Zurück