Willkommen auf dem Portal für Mediengestalter
|
|
Autor |
Nachricht |
Ilustratorius
Threadersteller
Dabei seit: 16.06.2009
Ort: Garlstedt
Alter: 31
Geschlecht:
|
Verfasst So 01.11.2009 18:19
Titel Problem mit Homepage |
|
|
Hallo,
es sind bei mir 2 Probleme aufgetaucht.
Code: | <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Unbenanntes Dokument</title>
<style type="text/css">
<!--
body,td,th {
color: #000;
}
body {
background-color: #160D08;
background-image: url(Neuer%20Ordner/Sample.jpg);
background-repeat: no-repeat;
background-position:top center;
}
#Menue {
position:absolute;
top: 186px;
left: 304px;
width:714px;
}
#Menue table {
width:100%;
border:none;
}
a:link {
color: #000;
}
a:visited {
color: #000;
}
a:hover {
color: #000;
}
a:active {
color: #000;
}
-->
</style>
<script 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 onload="MM_preloadImages('Neuer Ordner/Navigation braun/Home.jpg','Neuer Ordner/Navigation braun/About_the_photographer.jpg','Neuer Ordner/Navigation braun/Image_Gallerys.jpg','Neuer Ordner/Navigation braun/Travel_reports.jpg','Neuer Ordner/Navigation braun/Publications.jpg','Neuer Ordner/Navigation braun/Imprint.jpg')">
<p> </p>
</head>
<body>
<div id="Menue">
<table width="98%">
<tr>
<td><a href="www.outdoorphotography.de/index.htm" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Home','','Neuer Ordner/Navigation braun/Home.jpg',1)"><img src="Neuer Ordner/Navigation normal/Home_n.jpg" name="Home" width="58" height="34" border="0" id="Home" /></a><a href="www.outdoorphotography.de/a_t_p.htm" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('About the Photographer','','Neuer Ordner/Navigation braun/About_the_photographer.jpg',1)"><img src="Neuer Ordner/Navigation normal/About_the_photographer_n.jpg" name="About the Photographer" width="167" height="34" border="0" id="About the Photographer" /></a><a href="www.outdoorphotography.de/i_g.htm" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image gallerys','','Neuer Ordner/Navigation braun/Image_Gallerys.jpg',1)"><img src="Neuer Ordner/Navigation normal/Image_gallerys_n.jpg" name="Image gallerys" width="112" height="34" border="0" id="Image gallerys" /></a><a href="www.outdoorphotography.de/t_r.htm" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Travel reports','','Neuer Ordner/Navigation braun/Travel_reports.jpg',1)"><img src="Neuer Ordner/Navigation normal/Travel_reports_n.jpg" name="Travel reports" width="112" height="34" border="0" id="Travel reports" /></a><a href="www.outdoorphotography.de/p.htm" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Publications','','Neuer Ordner/Navigation braun/Publications.jpg',1)"><img src="Neuer Ordner/Navigation normal/Publications_n.jpg" name="Publications" width="94" height="34" border="0" id="Publications" /></a><a href="www.outdoorphotography.de/i_s.htm" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image sales','','Neuer Ordner/Navigation braun/Image_sales.jpg',0)"><img src="Neuer Ordner/Navigation normal/Image_sales_n.jpg" name="Image sales" width="91" height="34" border="0" id="Image sales" /></a><a href="www.outdoorphotography.de/i.htm" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Imprint','','Neuer Ordner/Navigation braun/Imprint.jpg',1)"><img src="Neuer Ordner/Navigation normal/Imprint_n.jpg" name="Imprint" width="73" height="34" border="0" id="Imprint" /></a></td>
</tr>
</table>
</div>
<div id=nächster Bereich"></div>
</body>
</html> |
Mein Problem NR.1 ist, das sich die Positionierte Tabelle beim Verändern des Browserfensters verschiebt. Ich möchte aber das sie fest auf der zugewiesenden Position sitzen bleibt.
Problem Nr.2 ist, das ich keinen Scrollbalken auf der rechten Seite habe, somit wird nicht mein gesamter Hintergrund angezeigt. Wie ändert man das???
Danke für eure Hilfe!
LG
|
|
|
|
|
dcn
Dabei seit: 20.08.2008
Ort: -
Alter: 43
Geschlecht:
|
Verfasst So 01.11.2009 19:09
Titel
|
|
|
Hallo Ilustratorius,
erst einmal solltest du darauf achten das so etwas nicht passiert:
Zitat: | }
//-->
</script>
</head>
<body onload="MM_preloadImages('Neuer Ordner/Navigation braun/Home.jpg','Neuer Ordner/Navigation braun/About_the_photographer.jpg','Neuer Ordner/Navigation braun/Image_Gallerys.jpg','Neuer Ordner/Navigation braun/Travel_reports.jpg','Neuer Ordner/Navigation braun/Publications.jpg','Neuer Ordner/Navigation braun/Imprint.jpg')">
<p> </p>
</head>
<body>
<div id="
.
.
<div id= " nächster Bereich">
|
In den Head gehören die Styleinformationen und die Scripte. Im Body hast du die Elementauszeichnungen die auf Style oder Scriptinfos vom Head zugreifen.
Zu dem ersten Problem empfehl ich das DIV für die Navigationstabelle mit der Eigenschaft "position:fixed;" zu versehen. So hast du deine Navi immer an der zugewiesenen Stelle.
Dein zweites Problem ist eigentllich keins. Weil warum soll die Seite größer sein als Inhalte da sind nur weil das Hintergrundbild hübsch ist. Aber wenn du ein leeres DIV anlegst in der Größe deine Hintergrundbildes, dann erscheint eine Bildlaufleiste.
Ich erlaube mir ein paar kleine Tipps:
Versuch deine Styleinfos immer in einer *.css auszulagern. Das kommt in den Head und sieht so aus: "<link href="../style.css" rel="stylesheet" type="text/css" />". Vorteil ist, dass wenn deine Website aus mehreren Unterseiten besteht, diese nur eine Styledatei verwenden und der Wartungsaufwand geringer wird. Dann solltest du darauf achten dass verlinkte Dateien immer realtiv angegeben werden. Also abhängig von der Quelle von der die Daten angefordert werden.
Ähnlich ist es gut wenn du scripte, genau wie cssinfos, auslagerst.
beste Grüße
*edit* ich seh eben das die Pfade ja relativ angegeben wurde, nur tust du gut dran darauf zu achten, dass die Ordner keine Freizeichen beinhalten.
Zuletzt bearbeitet von dcn am So 01.11.2009 19:20, insgesamt 2-mal bearbeitet
|
|
|
|
|
Anzeige
|
|
|
Ilustratorius
Threadersteller
Dabei seit: 16.06.2009
Ort: Garlstedt
Alter: 31
Geschlecht:
|
Verfasst So 01.11.2009 19:45
Titel
|
|
|
Danke für deine Antwort!
Entschuldige bitte, bei der Sache mit dem Scrollbalken stand ich etwas auf dem Schlauch....
Das Problem mit der Tabelle ist allerdings immernoch vorhanden. Wenn ich
Code: | #Menue {
position: absolute;
top: 183px;
left: 297px;
width:728;
} |
durch
Code: | #Menue {
position: fixed;
top: 183px;
left: 297px;
width:728;
background-attachment: inherit;
} |
ersetze, dann ist die Tabelle überhaupt nicht mehr an der Stelle, wo ich sie vorher positioniert habe.
LG
Zuletzt bearbeitet von Ilustratorius am So 01.11.2009 19:45, insgesamt 1-mal bearbeitet
|
|
|
|
|
dcn
Dabei seit: 20.08.2008
Ort: -
Alter: 43
Geschlecht:
|
Verfasst So 01.11.2009 20:14
Titel
|
|
|
Ich hoffe das ich nicht ganz falsch liege aber Probier es mal folgend:
Zitat: | html Datei:
Code: |
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Headline</title>
<link href="style.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="script.js"></script>
</head>
<body>
<div id="Menue">
<table id="tbl">
<tr>
<td>
</td>
</tr>
</table>
</div>
<div id="BGstretch"></div>
</body>
</html>
|
|
Zitat: | die style.css
Code: |
* {
margin:0;
padding:0;
}
body,td,th {
color: #000;
}
body {
background-color: #fff;
background-image: url("img/Sample.jpg");
background-repeat: no-repeat;
background-position:top center;
}
a:link {
color: #000;
}
a:visited {
color: #000;
}
a:hover {
color: #000;
}
a:active {
color: #000;
}
#BGstretch {
position:absolute;
left:0;
top:0;
width:100%;
height:200%;
}
#Menue {
position:fixed;
top: 186px;
left: 304px;
width:714px;
height:50px;
}
#tbl {
width:100%;
height:100%;
border:1px solid #999;
}
|
|
Zitat: | und die script.js
Code: |
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];}
}
|
|
Wichtig ist, dass die Dateien auch script.js und style.css heißen und in dem selben Ordner wie deine html Datei liegen. Bei mir gehts
Ach so. Es sieht so aus, dass die Seite sich in der Mitte des Browser dargestellt werden soll?
|
|
|
|
|
Ilustratorius
Threadersteller
Dabei seit: 16.06.2009
Ort: Garlstedt
Alter: 31
Geschlecht:
|
Verfasst So 01.11.2009 20:32
Titel
|
|
|
Hallo,
ich werde das gleich mal bei mir ausprobieren.
Doch eigentlich soll die Seite mittig dargestellt werden.
LG
|
|
|
|
|
Ilustratorius
Threadersteller
Dabei seit: 16.06.2009
Ort: Garlstedt
Alter: 31
Geschlecht:
|
Verfasst So 01.11.2009 20:37
Titel
|
|
|
Hmmm....mein Problem ist, das ich einfach nicht weiß wie das was du mir gepostet hast funktioniert. Da ich noch weitere Seiten dieser Art erstellen muss ( für die weiteren Menüpunkte ) würde das für mich zu einem Problem werden. Am besten wäre es, wenn ich das ganze in der von mir geposteten Datein hinbekommen würde...
Hast du da vllt. eine Idee?
LG
|
|
|
|
|
dcn
Dabei seit: 20.08.2008
Ort: -
Alter: 43
Geschlecht:
|
Verfasst So 01.11.2009 20:56
Titel
|
|
|
Ich werde mich morgen auf Arbeit der Sache mal annehmen.
Aber du brauchst nur den Texeditor öffnen, da die Inhalte von der style.css reinkopieren, diese als style.css speichern und das wars. Genauso mit der script.js und deiner index.html.
Ansonsten hast du sehr gute Infos zum Boxenmodel bei css4you.de
|
|
|
|
|
|
|
|
Ähnliche Themen |
Flash Homepage: Problem
problem mit homepage zentrieren
Problem beim Aktualisieren der Homepage
Problem beim Resizen der Homepage
[html] Bundeswehr Intranet-Homepage / Problem
Homepage (HTML) Ansicht-Problem. Suche Hilfe!
|
|
|
Du kannst keine Beiträge in dieses Forum schreiben. Du kannst auf Beiträge in diesem Forum nicht antworten. Du kannst an Umfragen in diesem Forum nicht mitmachen.
|
|