• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Unterstützung gesucht bei Website ohne Framesets aber ähnliche Eigenschaften

W

w.a.mo.

Neues Mitglied
Hallo html-Gemeinde,

erstmal einen Dank an alle Beteiligten eines solch tollen Forums.
Leider versuche ich mich gerade als HTML-Newbie an ein etwas zu anforderndes Projekt.
Meine z. Zt. noch im Aufbau befindliche Website, hat (und hier benötige ich auch schon Hilfe) eine mittles CSS gestaltete Navleiste womit sich allerdings das Problem ergibt, dass ich in jede interne Seite die Links dazu angeben muss :cry:.
Da ich nun schon seit knapp 120 Std am lesen, recherchieren, Code Schreiben (meist mittles copy -> past) rum experimentiere und auch g***le meine eingegebenen Fragen nicht so richtig auswertet hoffe ihr könnt mir behilflich sein.

Zu den einzelnen Problemen:

  1. Die Links in der Navleiste sollen nicht in jede erstellte webseite mit allen kladratsch eingegeben werden müssen, (allerdings Frameset frei) da sobald ich eine neue Site hinzufüge müsste ich doch in sämtlichen anderen Seiten die links ebenso ergänzen/umändern(->mächtig arbeit):shock:??
  2. Ich bekomms nicht auf die Reihe ein anfrage <form> zu integrieren welches mit clickboxes die auswahl vereinfacht und anschliessend an mich sendet
  3. Ich habe keine Ahnung wie .php; perl; cgi; Java; oder ähnliches zu scripten und auf die schnelle zu erlernen wäre.
  4. Da es sich um Meine zukünftige Firmenseite geht bitte ich, mir nicht Schleichwerbung vorzuwerfen. Ich versuche alle Firmenrelevanten Sachen aussen vor zu lassen.
  5. Warum ich keinen Profi mit der Sache beauftrage?? Nun ich hab mir bereits verschiedene Angebote eingeholt und die waren mir einfach zu überteuert nur um ein Layout mit eben diesen funktionen zu kreiren. Und weil ich mich selber mal mit der Materie des Webs beschäftigen wollte. wußte ja nicht dass es so schwierig ist.
Bitte bei nachfolgendem Q-code meine unsaubere Gestaltungsart zu ignorieren. Sorry

die CSS:

Code: 
/* Generated by KompoZer */
div#Tmenu {
  border-style: none ridge none none;
  border-color: white;
  border-right: 5px ridge white;
  overflow: visible;
  z-index: 99;
  padding-bottom: 0em;
  background-image: url(../img/hintergrund.png);
  height: 100%;
  float: left;
  background-color: transparent;
  position: fixed;
  font-size: 94%;
  width: 13.2em;
  margin-left: -1px;
  background-position:  center center;
  padding-top: 7.7em;
  background-repeat: no-repeat;
  margin-top: -31px;
}
* html div#Tmenu {
  width: 10em;
}
ul#Navigation {
  padding: 0;
  color: black;
  font-weight: normal;
  font-family: Calibri;
}
ul#Navigation li {
  margin-right: 0;
  padding-left: 0.8em;
  width: 8em;
color: black;  
list-style-position: outside;
  list-style-type: none;
  position: relative;
  background-color: transparent;
  background-position: left center;
  background-repeat: no-repeat;
  list-style-image: url();
}
ul#Navigation li ul {
  margin: 0;
  padding: 0;
  background-color: transparent;
  -x-background-y-position: center;
  position: absolute;
  top: 0;
  left: 9em;
}
ul#Navigation li ul li {
  margin: 0;
  padding-left: 0.8em;
  width: 8em;
  background-repeat: no-repeat;
  -x-background-y-position: center;
}
ul#Navigation a, ul#Navigation span {
  border:  none;
  padding: 0.8em;
  width: 8em;
  background-image: url(../img/Button.png);
  display: block;
color: black;  
font-size: 1em;
  font-weight: 500;
  font-style: normal;
  font-family: Calibri;
  background-position: left center;
  background-color: transparent;
  background-repeat: no-repeat;
  text-align: center;
  text-decoration: none;
}
ul#Navigation a:hover {
color: black;  
background-image: url(../img/Button1%20Kopie.png);
  background-position:  center center;
  background-color: transparent;
  background-repeat: no-repeat;
}
ul#Navigation span, li a#aktuell:hover {
color: black; 
 background-image: url(../img/Button2.png);
  background-position:  center center;
  background-color: transparent;
  background-repeat: no-repeat;
}
li a#aktuell {
  color: black;
  background-color: transparent;
  background-image: url(../img/Button2.png);
  background-repeat: no-repeat;
  background-position:  center center;
}
ul#Navigation li ul span {
  color: black;
  background-color: transparent;
  background-position:  center center;
  background-repeat: no-repeat;
  background-image: url(../img/Button2.png);
}
ul#Navigation li a:active {
  color: black;
  background-color: transparent;
  background-image: url(../img/Button2.png);
  background-position:  center center;
  background-repeat: no-repeat;
}
ul#Navigation li ul {
   display: none;
}
ul#Navigation li:hover ul {
    display: block;
}
ul#Navigation li:hover a {
}
body {
  background: transparent url(img/hintergrund.png) no-repeat fixed right center;
  z-index: 1;
  width: 100%;
  margin-left: -1px;
}
.inside {
  border-style: hidden;
  padding: 2em 1.5em;
  width: 65%;
  height: 100%;
  margin-left: 13.5em;
  margin-right: auto;
  margin-top: -4em;
  background-image: url(../img/hindergrundnav.png);
  background-position:  center center;
}
#logo {
  border-style: none;
  position: fixed;
  z-index: 101;
  background-color: transparent;
  float: left;
}
div#text {
  text-align: justify;
  font-size: 1em;
  color: black;
  font-weight: 100;
  font-style: normal;
  font-family: Calibri;
}
div#text1 {
  width: 100%;
  text-align: justify;
  font-size: 1em;
  color: black;
  font-weight: 100;
  font-style: normal;
  font-family: Calibri;
}

Hier der Q-Code:


HTML: 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" 

"http://www.w3.org/TR/html4/loose.dtd">

<html>
<head>
<meta content="text/html; charset=ISO-8859-1" http-equiv="content-type">
<title>#</title>
<link rel="stylesheet" href="css/style.css" type="text/css">
<meta name="Keywords" content="# ">
<meta name="Description" content="Wir bieten fachgerechte Bauleistungen aus dem Bereich . ">
<meta name="Author" content="#">
<meta name="Copyright" content="# ">
<meta name="Audience" content="Anzeige/Kleinanzeige">
<meta name="Content-language" content="DE ">
<meta name="Page-type" content="">
<meta name="Robots" content="INDEX,FOLLOW">
<meta name="Revisit-after" content="14 days">
 <meta content="index, follow" name="googlebot">
<style type="text/css">
</style>

</head>

<body style="background: transparent url(img/hintergrund.png) no-repeat fixed right center; z-index: 1; 

width: 100%; margin-left: -1px;">
<br>
<img style="width: 174px; height: 70px;" id="logo" alt="Logo" src="img/WEBAND1.png">
<div id="Tmenu">
<ul id="Navigation">
<li><a href="home.html">Home</a>
 <ul>
   <li><a href="aktion.html">Aktionen</a></li>
   <li><a href="about.html">&Uuml;ber Uns</a></li>
   <li><a href="kontakt.html">Kontakt</a>
     <ul>
        <li><a href="info.html">Anfrage</a></li>
    </ul></li>
  <li><a href="agb.html">AGB</a></li>
 </ul></li>
   <li><a href="fliesen.html">Fliesen</a>
<ul>
   <li><a href="tilehistory.html">Geschichte</a></li>
   <li><a href="din.html">Normen</a></li>
   <li><a href="formate.html">Formate</a></li>
</ul>
</li>
<li><a href="holz.html">Holz</a>
<ul>
   <li><a href="parkett.html">Parkett</a></li>
   <li><a href="laminat.html">Laminat</a></li>
   <li><a href="verlegung.html">Verlegetipps</a></li>
</ul>
</li>
<li><a href="faq.html">FAQ's</a>
<ul>
    <li><a href="faqfliesen.html">Fliesen</a></li>
    <li><a href="faqholz.html">Holz</a></li>
    <li><a href="impressum.html">Impressum</a>
      <ul>
         <li><a href="disclaimer.html">Disclaimer</a></li>
      </ul> 
    </li>
</ul>
</li>
</ul>
</div>
<div class="inside"  style="height: 60em">
<br>
<div id="text">
<br><h2>Tut uns leid...</h2>
<br>
<h3><i>Diese Seite befindet sich derzeit noch im Aufbau.</i></h3>
<br>
<p>Demnächst können Sie sich hier umfassend über unser qualitatives Leistungsangebot informieren.</p>
<br>
<p>Sollten Sie vorab von uns Informationen benötigen, erreichen Sie uns <a 

href="kontakt.html">hier</a></p>
<br>
<p>Vielen Dank für Ihr Verständnis.</p><br>
<br>
<p><b>Ihr Team</b></p><br>
<br>
</div>
</div>
</body>
Kann damit jemand was anfangen???

Danke schon mal vorab an die sich bereiterklären mir zu helfen.

Gruß Andy
 
dein Navi Problem --> include doch einfach deine navi mittels php? dann musst du nur eine datei bearbeiten und sie wird überall dann bearbeitet .... der Rest ist auch nicht so schwer, könnte dir auch bei der page helfen wenn du willst
 
Danke für die schnelle antwort.

Das mit dem include hab ich schon mal gelesen nur nicht verstanden. Da ich glaube durch die button eigenschaften die sich aus dem css ergeben funktioniert das dann nicht mehr. Oder liege ich falsch. Ich hoffe ich kann den link zu site hier veröffenlitchen???
gruß
 
klar kansnte den veröffentlichen, ne funktioniert eig ^^ einfach in eine externe html datei dein
PHP: 
<ul><li><a href="link">Blabla </a></li></ul>
einfach deine ganze navi und zb. als navi.html speichern und an der stelle wo sie war in deiner html datei dann
PHP: 
<?php include("navi.html"); ?>
die seite dann aber als .php speichern und nicht als html
 
tipp, dein menuover ist zu arg finde ich ... das includen bedeutet nur, dass der inhalt der datei in den bisherigen quellcode reinkommt, damit man es nicht in jede Datei neu schreiben muss... wenn du es so machst wie in meinem beispiel , dann die navi.html einfach in das gleiche verzeichnis wie deine anderen seiten... aber die anderen seiten müssen dann .php sein, damit die include funktion funktioniert
 
Erst mal hallo und herzlich willkommen auf html.de
nun die php idee ist schon am naheliegensten da ich gerade eben meine eigene seite aufgebaut habe und ich festgestellt habe dass wenn ich
die navi per html und css mache ich das problem habe dass ich enorme arbeit reinstecken muss damit die navi überall stimmt.

Ich habe allerdings noch eine frage wenn ich mehrere pages in verschiedenen Ordnern habegehts dann auch? denn in jedem ist ja die verlinkung wieder anderst.
 
ja, aber da du die php datei ja eh in jeder seite includen musst, dort eben den Pfad angeben ... also das Problem mit der css hatte ich noch nie ?!
 
sorry im moment steh ich voll aufm schlauch. war ja schon froh mir annähernd die html sachen in 120std anzulernen für php brauch ich vorne weg 250 Std.
Sollte nicht heissen dass ich gegen php bin aber da ich seit eineinhalb wochen a 18 std Quellcodes lesen und noch verstehen lernen musste wozu andere verm. monate erübrigt haben "respekt" bin ich im moment nicht sehr aufnahmefähig im Geiste. tschuldigung.
 
welches problem mit dem css?

mach eine neue .html seite

die benennst du mit navi.html und dort ist nur die navigation drinn.

dann setzt du an dem du die navi hast den code
PHP: 
 <?php include("navi.html"); ?>

die seite in der du diesen /\ Code setzt muss dann mit .php enden und nicht mit .html

dann lädst du die seite hoch und tada es sollte funzen das problem ist nun dass du die Seite nur mit xammp (oder ähnlichen Programmen)
oder direkt auf dem server anschauen. da php eine serverseitige sprache ist.

LG devilseye
 
du hast doch oben geschrieben, dass es für dich ein großer Aufwand ist die css dann so anzupassen, dass es überall gleich ist ...
 
es ist nicht das problem mit dem layout sondern dass alle links stimmen und das ist weniger ein css problem als ein aufwand problem

Greez.
 
So das ganze jetzt mal gemacht und wie befürchtet ist dann die Spielerei mit den grünen Buttons vorbei. da die jeweilige id="aktuell" und <span> zuweisung fehlt*schade*
wie müsste dann die Sache angegangen werden damits funktioniert?
mittels java oder ähnlichem??

Gruß
 
kopier einfach alles was im css und im html mit der navigation zu tun haben in die navi.html dann sollte es eigentlich gehen und wie gesagt du kannst es nur mit einem server oder mit einem local server ansehen
 
um das Problem mal ausfühlich zu erklären:

wenn der Button nicht aktiv ist:
Code: 
<li><a href="home.html">Home</a>
 <ul>
   <li><a href="aktion.html">Aktionen</a></li>
   <li><a href="about.html">&Uuml;ber Uns</a></li>
   <li><a href="kontakt.html">Kontakt</a>
soll erButton.png sein also ohne zuweisung

wenn a:hover dann Button1 Kopie.pngrot und

wenn activ
Code: 
<li><a id="aktuell" href="home.html">Home</a>
 <ul>
   <li><a href="aktion.html">Aktionen</a></li>
   <li><a href="about.html">&Uuml;ber Uns</a></li>
   <li><a id="aktuell" href="kontakt.html">Kontakt</a>
<ul>
      <li><span>Anfrage</span></li>
durch id ="aktuell" und <span> dann Button2.pnggrün.

Da bereits das overmenue angesprochen wurde.

meine Ziel war ursprünglich ein vertikales Slidemenue mit eben diesen Grafiken wurde aber wegen nicht verstehens der programierung wieder verworfen.

Grüße
Andy
 
Ich weiss was du meinst aber zumindest das hover sollte ohne javaScript zu bewältigen sein. für das andere wäre js von nöten da die navi.html ausgelagert ist und nicht direkt im hauptdokument geschrieben ist.
 
soweit hab ich das verstanden. aber wie müsste ein js code hierfür aussehen und was ist einfacher ein Slidemneue mit sich nachunten öffnenden/schiebenden Umenues oder eben so wies jetzt ist??
Welche schriftgröße setzt ihr bei solchen navbuttons an (em).
Gruß
 
gerade das ist mein problem denn wenn ich google suche ich natürlich mit einer mir am nächsten verständliche fragestellung.
mein größtes problem ist vermutlich meine grafische denkweise beri der ganzen Sache ich versuche über das Layout praktisch die Funktionen zu erlernen und HTML ist nun mal nicht grafisch ohne CSS und anderen programmsprachen.
also bitte nicht verurteilen dafür wenn ich einiges nicht gleich auf anhieb verstehe oder zuordnen kann.

Gruß
 
Du musst dich einloggen oder registrieren, um hier zu antworten.

Neueste Beiträge

Zurück
Oben