Announcement

Collapse
No announcement yet.

html laden in Zeitintervallen

Collapse
X
Collapse
  • Page of 1
  • Filter
  • Time
  • Show
Clear All
new posts
Previous template Next
  • #1

    html laden in Zeitintervallen

    Hallo,

    ich würde gerne eine html machen in der ich verschiedene HTMLs anzeigen lassen kann.
    Ich würde es gerne so machen das die die gezeigt wird durch die neue ersetzt wird, und das eben in einem abstand von x sec, und das in einer Schleife.

    Ich dachte mri ich mache es mit einem jScript und habe mir dazu die seite von Spieletipps.de angesehen und den dazugehörigen quelltext. Dort ist nur das Problem das es Bilder sind die geslided werden und nicht eine ganze Page.

    Ich dachte mir vllt geht das auch mit iframe, aber wie sage ich dort das es nach x sec die neue seite laden soll?

    Noch eine möglichkeit wäre ja Jscript, aber davon hab ich noch weniger Ahnung.
    Tags: html weschel, javascript, jscript, slide
  • #2
    Ich habe mal den Code von Spieletipps.de abgespeckt somit das nur noch der Bilderweschel im Vordergrund steht und das ganze unwichtige Zeug (für diesen Fall) weg ist.

    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" xml:lang="de_DE" lang="de_DE">
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
		<title>TestSeite2</title>
		<link href="./layout2.css" rel="stylesheet" type="text/css" />
		
		<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>
		<script type="text/javascript" src="http://static.spieletipps.de/js/jq/core.js"></script>
	</head>

	<body>
		<div> 
			<div class="page_margins">
				<div class="page">
					<div id="main">
						<div id="col1">
							<div id="col1_content" class="clearfix">
								<div id="slider">
									<div id="contentSliderMain">
										 <a class="contslideimg" id="contslideimg-0" style="">
											<img src="./Bild1.jpg"/>
										 </a>
										 <a class="contslideimg" id="contslideimg-1" style="display: none;">
										 </a>
										 <a class="contslideimg" id="contslideimg-2" style="display: none;">
										 </a>
										 <a class="contslideimg" id="contslideimg-3" style="display: none;">
										 </a>
										 <a class="contslideimg" id="contslideimg-4" style="display: none;">
										 </a>
										 <div id="contentSliderFooter">
										 </div>
									</div>
									
									<div id="contentSliderNaviBox">
										<div class="contentSliderDesc">
											<img class="contentSliderActive" src="/static/layout/s/active.gif" style="display: none; opacity: 1"/>
											<img class="contentSliderInactive" src="/static/layout/s/inactive.gif"/>
											<a class="contslidebut" id="contslidebut-0">
												<span class="contentSliderMainDesc">Test 1</span>
												<br/>
												<span class="contentSliderSubDesc">Test 1 Sub</span>
											</a>
										</div>
										<div class="contentSliderDesc" style="top: 46px;">
											<img class="contentSliderActive" src="/static/layout/s/active.gif" style="display: none; opacity: 0"/>
											<img class="contentSliderInactive" src="/static/layout/s/inactive.gif"/>
											<a class="contslidebut" id="contslidebut-1">
												<span class="contentSliderMainDesc">Test 2</span>
												<br/>
												<span class="contentSliderSubDesc">Test 2 Sub</span>
											</a>
										</div>
										<div class="contentSliderDesc" style="top: 92px;">
											<img class="contentSliderActive" src="/static/layout/s/active.gif" style="display: none; opacity: 0"/>
											<img class="contentSliderInactive" src="/static/layout/s/inactive.gif"/>
											<a class="contslidebut" id="contslidebut-2">
												<span class="contentSliderMainDesc">Test 3</span>
												<br/>
												<span class="contentSliderSubDesc">Test 3 Sub</span>
											</a>
										</div>
										<div class="contentSliderDesc" style="top: 138px;">
											<img class="contentSliderActive" src="/static/layout/s/active.gif" style="display: none; opacity: 0"/>
											<img class="contentSliderInactive" src="/static/layout/s/inactive.gif"/>
											<a class="contslidebut" id="contslidebut-3">
											<span class="contentSliderMainDesc">Test 4</span>
											<br/>
											<span class="contentSliderSubDesc">Test 4 Sub</span>
											</a>
										</div>
										<div class="contentSliderDesc" style="top: 184px;">
											<img class="contentSliderActive" src="/static/layout/s/active.gif" style="display: none; opacity: 0"/>
											<img class="contentSliderInactive" src="/static/layout/s/inactive.gif"/>
											<a class="contslidebut" id="contslidebut-4">
											<span class="contentSliderMainDesc">Test 5</span>
											<br/>
											<span class="contentSliderSubDesc">Test 5 Sub</span>
											</a>
										</div>
									</div>
									<div id="contentSliderTitleBox">
										<a>
											<h5>Test 1</h5>
											<h6>Test 1Sub</h6>
										</a>
									</div>
									
								</div>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>				

		<script type="text/javascript">
			//<![CDATA[
		$("#slider").contentSlide({"data":[
		{"imgurl":"./Bild1.jpg","title":"Test1","subtitle":"Test1Sub","desc":"Test1","subdesc":"Test1Sub"},
		{"imgurl":"./Bild2.jpg","id":"1025","title":"Test2","subtitle":"Test2Sub","desc":"Test2","subdesc":"Test2Sub"},
		{"imgurl":"./Bild3.jpg","id":"1022","title":"Test3","subtitle":"Test3Sub","desc":"Test3","subdesc":"Test3Sub"},
		{"imgurl":"./Bild4.jpg","id":"1021","title":"Test4","subtitle":"Test4Sub","desc":"Test4","subdesc":"Test4Sub"},
		{"imgurl":"./Bild5.jpg","id":"1020","title":"Test5","subtitle":"Test5Sub","desc":"Test5","subdesc":"Test5Sub"}],
		"platform":null});    //]]>
		</script>
	
	</body>
</html>

    Comment

    • #3
      Moin,

      welchen Zweck wird das erfüllen? Dazu gibts dann verschiedene Lösungsansätze.

      Bei jeglichen Clientlösungen ist die Gefahr groß, dass nichts angezeigt wird, weil diese idR abschaltbar, also optional sind. JavaScript und auch AJAX sind hier durchaus Möglichkeiten, aber auch Flash wäre denkbar. Das sollte aber nur benutzt werden, wenn der Nutzerkreis eindeutig absteckbar ist (z.B: Intranet oder passwortgeschützte Site) oder der anzuzeigende Inhalt nicht wichtig ist.

      Ansonsten könnte man auch eine reine serverseitige Lösung anstreben, die kann dann wenigstens jeder nutzen, da gibts dann halt kein automatisches Neu laden, sowas kann nur clientseitig ausgelöst werden. Aber, und deswegen fragte ich nach dem Sinn, eine Seite, die ständig und unaufgefordert ihre Inhalte wechselt, ist eher nicht üblich und für den Anwender nicht unbedingt sinnvoll.

      Für die Richtung, in die Du zu denken scheinst, würde ich Dir empfehlen, Dich in Ajax einzulesen.

      Liebe Grüße,
      -Efchen

      Comment

      • #4
        Dankeschön, werde ich mir mal anschaun.

        Meine Grund für so eine Seite ist, das ich drei verschiedene Seiten habe in dennen Tabellen angezeigt werden. Diese sollen sich aber nach ca 20 sec wechseln, damit ich immer einen Überbick über die jeweilige Tabelle habe.
        Sie in eine seite mit 3 frames zu pagen wäre nicht so toll, daher dachte ich kann man es bestimmt auch damit lösen.

        Comment

        • #5
          Wenn es sowieso nur eine Seite für Deine persönliche Nutzung ist, was sollte gegen die Verwendung von Frames sprechen? Auf öffentlich zugänglichen Sites rate ich immer von rückständigen Techniken wie Frames oder von optionalen Techniken wie Ajax oder Flash ab, aber beim persönlichen Bedarf müssen diese Regeln nicht gelten.

          Frameset, drei Seiten rein und in die Seiten ein reload per <meta> - fertig.

          Auf öffentlichen Seiten würde ich das vermutlich mit Ajax machen und zusätzlich für alle mit abgeschaltetem JavaScript einen Button zum Neu laden.

          Comment

          • #6
            Es ist nur für den Privat gebrauch.

            Das mit Frames klingt sehr gut und wie man das ganze mit den Meta daten macht habe ich schon.
            Nur fehlt mir noch die Info wie ich sagen kann, das es nur Seite A oder B oder C lädt bzw. wenn A geladen dann B, wenn B geladen dann C und wenn C geladen dann A.

            Comment

            • #7
              Das meta-Tag wird ja nicht in die Frameset-Seite eingebaut, sondern in die drei anzuzeigenden Seiten. Du setzt eine Zeit in Sekunden, in der die Seite neu geladen wird. Ob und wann eine Seite neu geladen wird, bestimmt also die Seite selber und nicht die mit dem Frameset.

              Für alles, was darüber hinaus geht, ist JavaScript sicher besser (Nachbarforum).

              Viel Erfolg,
              -Efchen

              Comment

              • #8
                Ok dann werde ich mich mal da umsehen, danke.

                Comment

                Previous template Next
                Working...
                X