nicht angemeldet
Hi,
Wie zum Teufel programmiere ich solch herrlichen Effekt?
Einfaches Beispiel (sollte auch ohne Kommentare verständlich sein):
<html>
<head>
<title>News</title>
<style type="text/css"><!--
.news { margin: 10px; width: 15em; background-color: #EEEEEE; }
.intro { display: none; }
--></style>
<script type="text/javascript" language="JavaScript" src="switchnews.js"></script>
</head>
<body>
<div class="news">
<div class="intro">Kurztext 1</div>
<div class="text">Langtext 1</div>
</div>
<div class="news">
<div class="intro">Kurztext 2</div>
<div class="text">Langtext 2</div>
</div>
<div class="news">
<div class="intro">Kurztext 3</div>
<div class="text">Langtext 3</div>
</div>
</body>
</html>
Und die dazugehörige switchnews.js:
function initNews() {
if(document.getElementsByTagName) {
divColl=document.getElementsByTagName("div");
for(i=0;i<divColl.length;i++) {
switch(divColl[i].className) {
case "news":
if(!initNews["activeNews"]) { initNews["activeNews"]=divColl[i]; }
divColl[i].onmouseover=function() { displayNews(this); }
break;
case "intro":
divColl[i].style.display="block";
break;
case "text":
divColl[i].style.display="none";
break;
}
}
}
displayNews(initNews["activeNews"],true);
}
function displayNews(newsObj,ignoreOld) {
if(!ignoreOld) {
initNews["activeNews"].getElementsByTagName('div')[1].style.display='none';
initNews["activeNews"].getElementsByTagName('div')[0].style.display='block';
initNews["activeNews"]=newsObj;
}
initNews["activeNews"].getElementsByTagName('div')[0].style.display='none';
initNews["activeNews"].getElementsByTagName('div')[1].style.display='block';
}
window.onload=initNews;
Bitte helft mir, denn ich kann nicht mehr schlafen...:-)
Jetzt wieder besser? ;-)
Jetzt darfst Du aber selbst verfeinern, z.B. daß eine im Intro exisiterende Grafik sich schrittweise aufbaut, etc.
Gruß, Cybaer
--
Hinweis an Fragesteller: Fremde haben ihre Freizeit geopfert, um Dir zu helfen. Helfe Du auch im Archiv Suchenden: Beende deinen Thread mit einem "Hat geholfen" oder "Hat nicht geholfen"!
Hinweis an Fragesteller: Fremde haben ihre Freizeit geopfert, um Dir zu helfen. Helfe Du auch im Archiv Suchenden: Beende deinen Thread mit einem "Hat geholfen" oder "Hat nicht geholfen"!
Der Martin