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

Content Bereich: Newsbox

S

Sharkzz

Neues Mitglied
Hallo,

und zwar habe ich auf meiner Homepage einen Newstext im Content Bereich. Nun habe ich unten drunter Buttons erstellt, um durch die verschiedenen News zu blättern, ich frage mich ob es möglich ist, dasa ich auf der Startseite bleibe und durch drücken der Buttons sich der Text dementsprechend ändert, allerdings ohne die Startseite zu verlassen oder ist das mit HTMl/CSS nicht möglich ?

MFG

1.JPG
 
Werbung:
Nein, dafür brauchst Du JavaScript. Damit kannst Du entweder im HTML-Code stehende Newsmeldungen jeweils hervorheben/einblenden oder per AJAX direkt vom Server laden.
 
Werbung:
Den genauen Namen habe ich dir schon genannt. Und ja, es gibt massenweise Tutorials für AJAX. Wenn Du allerdings erstere Variante meinst, dann musst Du dir nur JavaScript-Grundlagen anschauen um zu verstehen wie es geht, einen Namen hat diese Variante nicht.
 
HTML: 
<!DOCTYPE html><html><head>

<script type="text/javascript">
//ladeContentVomServer heißt die function die aufgerufen wird wenn der button an geklickt wird  
function ladeContentVomServer(){
   var xmlhttp;
   if (window.XMLHttpRequest)  {
      // code for IE7+, Firefox, Chrome, Opera, Safari  
      xmlhttp=new XMLHttpRequest();  
   }else  {
      // code for IE6, IE5  
      xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");  
   }
   xmlhttp.onreadystatechange=function()  {
      //in diese if-abfrage gelangen wir wenn die antwort des servers in ordnung ist  
      if (xmlhttp.readyState==4 && xmlhttp.status==200)    {
         //hier greifen wir auf die unten devinierte id zu um die antwort (xmlhttp.responseText) des servers hinein zu schreiben.    
         document.getElementById("myDiv").innerHTML=xmlhttp.responseText;    
      }
   }
   //news.php ist die seite von der der neue inhalt geladen werden soll. news.php?id=123 ist auch gültig
   xmlhttp.open("GET","news.php",true);
   //mit xmlhttp.send(); wird der request abgeschickt.
   xmlhttp.send();
}
</script>
</head>
<body>

<!-- die id (myDiv) vergeben wir damit wir mit javascript den div-tag finden können der befüllt werden soll-->
<div id="myDiv">Hier kommt der neue inhalt hin</div>
 
<!-- onclick="ladeContentVomServer()" mit diesen event sagen wir wann die function ladeContentVomServer() aufgerufen werden soll dieses Attribut kann auch einen div oder einem link oder sonst einem tag mit gegeben werden -->
<button type="button" onclick="ladeContentVomServer()">Change Content</button>

</body>
</html>

ich hoffe das ist möglichst einfach zu verstehen falls doch nicht solltest du dich tatsächlich mit javascript basics auseinander setzten !

MfG Mario
 
Du musst dich einloggen oder registrieren, um hier zu antworten.

Neueste Beiträge

Zurück
Oben