[HTML] Target Links unter css?

Dieses Thema im Forum "Webentwicklung" wurde erstellt von -=LuIgI=-, 17. Juli 2008 .

Schlagworte:
Status des Themas:
Es sind keine weiteren Antworten möglich.
  1. 17. Juli 2008
    Target Links unter css?

    Hey,

    gestallte grade eine Seite in CSS aber jetzt komm ich nicht weiter.

    HTML:
    <html>

 <head>
 <meta http-equiv="content-type" content="text/html;charset=iso-8859-1" />
 <title>Forstbetrieb</title>

 <style type="text/css">
 <!--
 
 #Header {
 background:url(wald.jpg) no-repeat left bottom;
 height: 150px;
 width: 800px;
 margin: 0 auto;
 border: 1px black solid;
 font-color: white;
 }

 #Navigation {
 background-color: white;
 height: 30px;
 width: 800px;
 margin: 0 auto;
 border: 1px black solid;
 }

 #Schatten {
 background:url(Schatten.jpg) repeat-x;
 width: 800px;
 margin: 0 auto;
 }

 #Content {
 background-color: white;
 height: 600px;
 width: 800px;
 margin: 0 auto;
 border: 1px black solid;
 }

 #Schatten2 {
 background:url(Schatten.jpg) repeat-x;
 width: 800px;
 margin: 0 auto;
 }
 
 -->
 </style>
 
 </head>

 <body>
 <div id="Header">
 <center><h1>
 <font color=#FFFFF>Forstbetrieb</font>
 </h1></center>
 </div>

 <div id="Navigation">
 1
 </div>

 <div id="Schatten">
 2
 </div>

 <div id="Content">
 3
 </div>

 <div id="Schatten2">
 4
 </div>

 </body>

</html>
    So ist die Seite momentan geschrieben. Jetzt will ich einen Traget-Link im Navigationsfenster erstellen der auf das Content-Fenster verweist wie bei einem Target-Link bei Frames.

    Aber mit dem Befehl:

    HTML:
     <a href="kontakt.html" target="Content">Kontakt</a>
    Funzt es nicht, kann mir bitte einer sagen wie das funktioniert?

    Gruß LuIgI
     
  3. 17. Juli 2008
    AW: Target Links unter css?

    Probier doch mal so ....
    <a href="kontakt.html" id="Content">Kontakt</a>

    oder wenn es sich im Content Bereich befindet, dann setz doch für die Links sofort ein:

    content a {
    text-decoration:none;
    }

    und beim drüber gehen

    content a:hover {
    text-decoration:none;
    }

     
  4. 17. Juli 2008
    AW: Target Links unter css?

    Nein das funktioniert leider nicht, dann öffnet sich einfach eine neue Seite.

    Gruß LuIgI
     
  5. 17. Juli 2008
    AW: Target Links unter css?

    Hört sich an, als ob du nur den Content bereich ändern willst.

    Wenn Ja, dann geht das nur, wenn dort ein Iframe ist, den Inhalt eines Div´s kann man nur mit
    Js bzw Ajax ändern!


    Gruss 6000Loader
     
  6. 17. Juli 2008
    AW: Target Links unter css?

    ahhh jetzt weiß ich was du willst^^

    das ist aber glaub ich nicht per css möglich ... da musst du javascript bzw. ajax verwenden.

    Code:
     <script language="javascript">
window.onload=getpage('main.html', 'content'); // der Inhalt der beim Laden der Seite aufgerufen wird.

function getpage(dataSource){
 var ajaxRequest; // The variable that makes Ajax possible!

 try{
 // Opera 8.0+, Firefox, Safari
 ajaxRequest = new XMLHttpRequest();
 } catch (e){
 // Internet Explorer Browsers
 try{
 ajaxRequest = new ActiveXObject("Msxml2.XMLHTTP");
 } catch (e) {
 try{
 ajaxRequest = new ActiveXObject("Microsoft.XMLHTTP");
 } catch (e){
 // Something went wrong
 alert("Your browser broke!");
 return false;
 }
 }
 }
 // Create a function that will receive data sent from the server

 var obj = document.getElementById('content');
 var queryString = "";


 try {

 ajaxRequest.open("POST", dataSource, true);

 } catch (e) {

 }
 ajaxRequest.setRequestHeader("Content-Type", "application/x-www-form-urlencoded; charset=UTF-8");
 ajaxRequest.onreadystatechange = function(){
 if (ajaxRequest.readyState < 4){
 obj.innerHTML = "Daten werden geladen...";
 }
 if(ajaxRequest.readyState == 4){
 obj.innerHTML = ajaxRequest.responseText;

 }
 }

 ajaxRequest.send(null);
}
</script>


und so müsste dann ein link bei dir aussehen
<a onclick="getpage('meineauswahl.php', 'ausgabe');">Kontakt</a>

    hab das net getestet ... musst gucken obs klappt. und ich hoffe ich hab dich wirklich richtig verstanden
     
  7. 17. Juli 2008
    AW: Target Links unter css?

    diese methode ist aber nicht sonderlich zu empfehlen
    lager deine css-sachen in eine neue datei aus und mach für jede seite eine neue datei
     
  8. 17. Juli 2008
    AW: Target Links unter css?

    habe ich bereits gemacht, meine index.html sieht so aus:

    HTML:
    <html>

 <head>
 
 <meta http-equiv="content-type" content="text/html;charset=iso-8859-1" />
 <link href="style.css" type="text/css" rel="stylesheet" />
 <title>Forstbetrieb</title>

 </head>

 <body>

 <div id="Header">
 <center><h1>
 <font color=#FFFFF>Forstbetrieb</font>
 </h1></center>
 </div>


 <div id="Navigation">
 <a href="kontakt.html" id="Inhalt">Kontakt</a>
 </div>


 <div id="Schatten">
 </div>


 <div id="Inhalt">
 3
 </div>


 <div id="Schatten2">
 4
 </div>
 

 </body>

</html>
    und meine Style.css sieht so aus....


    HTML:
    #Header {
 background:url(wald.jpg) no-repeat left bottom;
 height: 150px;
 width: 800px;
 margin: 0 auto;
 border: 1px black solid;
 font-color: white;
 }


#Navigation {
 background-color: white;
 height: 30px;
 width: 800px;
 margin: 0 auto;
 border: 1px black solid;
 }


#Schatten {
 background:url(Schatten.jpg) repeat-x;
 width: 800px;
 height: 20px;
 margin: 0 auto;
 }


#Inhalt {
 background-color: white;
 height: 600px;
 width: 800px;
 margin: 0 auto;
 border: 1px black solid;
 }


#Schatten2 {
 background:url(Schatten.jpg) repeat-x;
 width: 800px;
 margin: 0 auto;
 }
    was muss ich jetzt tuen?

    Gruß LuIgI
     
  9. 17. Juli 2008
    AW: Target Links unter css?

    Code:
    <html> 
<head> 
<meta http-equiv="content-type" content="text/html;charset=iso-8859-1" /> 
<link href="style.css" type="text/css" rel="stylesheet" /> 
<title>Forstbetrieb</title> 
</head> 
<body> 
<div id="Header"> 
<center><h1> 
<font color=#FFFFF>Forstbetrieb</font> </h1></center> 
</div> 
<div id="Navigation"> <a onclick="getpage('text.html', 'ausgabe');">Kontakt</a> </div> 
<div id="Schatten"> </div> 
<script language="javascript">
window.onload=getpage('main.html', 'content'); // der Inhalt der beim Laden der Seite aufgerufen wird.

function getpage(dataSource){
 var ajaxRequest; // The variable that makes Ajax possible!

 try{
 // Opera 8.0+, Firefox, Safari
 ajaxRequest = new XMLHttpRequest();
 } catch (e){
 // Internet Explorer Browsers
 try{
 ajaxRequest = new ActiveXObject("Msxml2.XMLHTTP");
 } catch (e) {
 try{
 ajaxRequest = new ActiveXObject("Microsoft.XMLHTTP");
 } catch (e){
 // Something went wrong
 alert("Your browser broke!");
 return false;
 }
 }
 }
 // Create a function that will receive data sent from the server

 var obj = document.getElementById('content');
 var queryString = "";


 try {

 ajaxRequest.open("POST", dataSource, true);

 } catch (e) {

 }
 ajaxRequest.setRequestHeader("Content-Type", "application/x-www-form-urlencoded; charset=UTF-8");
 ajaxRequest.onreadystatechange = function(){
 if (ajaxRequest.readyState < 4){
 obj.innerHTML = "Daten werden geladen...";
 }
 if(ajaxRequest.readyState == 4){
 obj.innerHTML = ajaxRequest.responseText;

 }
 }

 ajaxRequest.send(null);
}
</script>
<div id="content"> </div>

<div id="Schatten2"> 4 </div> 
 </body> 
</html>
    und dann legst jetzt die main.html datei an und schreibst da iwas rein und dann noch die text.html und da schreibst auch iwas rein ... dann sollte er automatisch die inhalte wechseln^^

    habs wieder net getestet^^
     
  10. 17. Juli 2008
    AW: Target Links unter css?

    Ist das richtig das du den Script in den Container Schatten reingeschrieben hast?

    Gruß LuIgI
     
  11. 17. Juli 2008
    AW: Target Links unter css?

    hat er doch garnet? und selbst wenn => wurscht

    bleib lieber bei statischen seiten, ganz erlich, ich glaub ajax usw is noch a weng zu hoch für dich, da musst erstmal javascript lernen
     
  12. 17. Juli 2008
    AW: Target Links unter css?

    Aber mein Design ist ja dann voll fürn ***** dann kann ich ja garkeine links machen ohne ne neue Seite zu öffnen, und dann ist mein Design ja völlig fehl am Platz.

    Gruß LuIgI

    Edit (

    Ich habe jetzt eine Lösung gefunden, bestimmt nicht die beste aber sie funktioniert:

    meine Index.html sieht momentan so aus:

    HTML:
    <html>

 <head>
 
 <meta http-equiv="content-type" content="text/html;charset=iso-8859-1" />
 <link href="style.css" type="text/css" rel="stylesheet" />
 <title>Abstract by LuIgI</title>

 </head>

 <body>

 <div id="Header">
 </div>


 <div id="Navigation">
 <center> 
 <a href="news.html">News</a>
 <a href="übermich.html">Über Mich</a>
 <a href="pictures.html">Pictures</a>
 <a href="guestbook.html">Guestbook</a>
 </center>
 </div>


 <div id="Schatten">
 </div>


 <div id="Inhalt">
 </div>


 <div id="Schatten2">
 </div>
 

 </body>

</html>
    Ich ahbe in die Navigation einfach Links rein geschrieben die auf die Dateien news.html, übermich.html, pictures.html und guestbook .html verweisen.

    Die anderen Dateien sehen genau so aus wie die Index.html, nur mit dem kleinen unterschied, das was im Inhalt Container steht. Und so wird es in dem geweünschten Bereich angeziegt

    Gruß LuIgI
     
  13. 17. Juli 2008
    AW: Target Links unter css?

    Japs, fang am besten klein an. erstmal html -> dann vllt php -> und dann javascript und andere sachen.

    zum Styles kriieren empfehle ich dir den iStylr. das ist eine online software womit man Templates erstellen kann. istylr.com dabei lernt man gut html und css. im Blog der seite sind auch gute videos wo gezeigt wird wie man ganz fix nen geiles template entwirft


    edit: so meinte murdoc das auch
     
  14. Video Script

    Videos zum Themenbereich

    * gefundene Videos auf YouTube, anhand der Überschrift.