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

Hilfe gesucht bei Adventskalender Erstellung

F

Fotofreak

Neues Mitglied
Hallo!
Ich benötige ein wenig Hilfe und hoffe sie hier zu finden.
Und zwar möchte ich auf meiner Homepage einen Adventskalender erstellen, es ist leider nicht mehr viel Zeit und ich bastel nun schon einige Tage, doch komme nicht weiter.
Vorab es ist mir nur mit HTML und Javascript möglich, da PHP nicht unterstützt wird! Und mir ist auch bewusst, dass dadurch die Datumsabfrage beeinflusst werden kann vom Nutzer.

Also ich habe bereits ein Foto hochgeladen und darauf 24 Imagemaps erstellt, für jedes Türchen eines!
Soweit so gut, diese Türchen sind verlinkt zu der jeweiligen Unterseite für den jeweiligen Tag, also Tag 1 z.B. auf advent1.
Doch nun möchte ich gerne noch eine Datumsabfrage, damit es nicht sofort möglich ist bereits vorher Türchen zu öffnen.
Ich habe mir verschiedenen Codeschnipsel im Netz zusammengesucht aber es will nicht funktionieren.

Code: 
<script type="text/javascript">
//<![CDATA[
function checkdate(tag)
    {
        heute = new Date ()
        tag=new Date (2014, 12)
        if (tag > heute)
        {
            alert ("Wer will da schummeln?")
        }
        else (tag <= heute)
        {
            window.location.href= "http://meineseite/adventskalender/tag-16/"
        }
    }
//]]>
</script>

Klicke ich beispielsweise auf Tag 1 so erscheint ein Fenster mit "Wer will da schummeln?".
Doch bestätigt man dies gelangt man trotzdem zu der Seite des Tages 1.
Darunter steht dann nur noch der folgende Code für die Imagemap:

Code: 
<img src="http://www.meinbild.de/std/image.jpg" border="1" alt="Adventskalender" usemap="#Kalender" /> <map name="Kalender" id=
"Kalender">
    <area shape="rect" coords="0,0,110,100" href="http://meineseite/adventskalender/tag-1/" onclick="checkdate (1)" alt="Advent 1" />
<area shape="rect" coords="111,0,210,100" href="http://meineseite/adventskalender/tag-14/" alt="Tag 14" />
    <area shape="rect" coords="211,0,310,100" href="http://meineseite/adventskalender/tag-4/" alt="Tag 4" />

Ich mache bestimmt irgendwas falsch oder es fehlt noch was, aber leider weiß ich nicht was und würde mich deshalb sehr über schnelle und hilfreiche Antworten freuen!
Danke
 
Werbung:
Da sind einige Fehler drin. Zum einen
Code: 
else (tag <= heute)

Wenn du im else Zweig noch eine Bedingung willst, musst Du schreiben "else if(...)". Das ist in deinem Fall aber ganz unnötig, da deine Bedingung exakt das ist, was ohnehin bei else ausgeführt würde.

Dann übergibst du einen Tag an die funktion den du dann in der zweiten Zeile ziemlich sinnfrei überschreibst. Was soll denn dabei rauskommen?

Code: 
function checkdate(tag){
    var date = new Date();
    var today= date.getDate();
    if(today == tag){
         window.location.href= "http://meineseite/adventskalender/tag-"+today+"/"
    }
    else {
        //User hat falschen Tag angeklickt.
    }
}
 
Zuletzt bearbeitet von einem Moderator:
Hallo pax!
Vielen Dank schon mal.
Ich habe es nun wie folgt:
Code: 
<script type="text/javascript">
//<![CDATA[
function checkdate(tag)
    {
        var date = new date();
        var today= date.getDate();
        if (today = tag)
        {
            window.location.href= "http://www.meineseite.de/adventskalender/tag-16/"
        }
        else
        {
            alert ("Wer will da schummeln?")
        }
    }
//]]>
</script>
<img src="http://www.meinbild.de/std/image.jpg" border="1" alt="Adventskalender" usemap="#Kalender" /> <map name="Kalender" id=
"Kalender">
    <area shape="rect" coords="0,0,110,100" href="http://meineseite/adventskalender/tag-1/" onclick="checkdate (1)" alt="Advent 1" />
    <area shape="rect" coords="111,0,210,100" href="http://meineseite/adventskalender/tag-14/" onclick="checkdate (14" alt="Tag 14" />

Du hast für den Link folgendes geschrieben:
Code: 
window.location.href= "http://meineseite/adventskalender/tag-"+today+"/"
Doch das verstehe ich noch nicht ganz?
Ist das mit dem oncklick im imagemap dann so richtig?
Oder muss ich da noch was anpassen?
Also woher weiß die Schleife das es genau zu Seite 1 oder 14 gehen muss und vorallem was muss ich dafür wohin schreiben?


Es tut mir sehr Leid mit den doofen Fragen hier, aber ich sehe irgendwie nicht mehr durch, nachdem ich nun soviel verschiedenen Code gelesen habe...
Würde mich über weitere Antworten dazu sehr freuen!
Danke!
 
Werbung:
Zu allererst musst du deutlich sorgfältiger auf deinen Code achten!

Code: 
if (today = tag)

ist falsch. "=" ist ein Zuweisungsoperator. Du gibst der variable today damit den wert von tag. Das hat in einer If-Abfrage nichts verloren. Der Vergleichsoperator ist "==".
In Deiner zweiten Area fehlt das ")" bei checkdate. Du solltest darüber nachdenken, etwas besseres als den normalen Editor zu verwenden. Notepad++ zum Beispiel.

Code: 
window.location.href= "http://meineseite/adventskalender/tag-"+today+"/"
Fotofreak schrieb:
Doch das verstehe ich noch nicht ganz?
...
Also woher weiß die Schleife das es genau zu Seite 1 oder 14 gehen muss und vorallem was muss ich dafür wohin schreiben?
Zum Vergrößern anklicken....

Das ist eine Stringverknüpfung. Der Link wird automatisch zusammengebaut aus den Teilen "http://meineseite/adventskalender/tag-" , dem Tag und dem letzten Backslash. Bei Tag 5 zum Beispiel ergibt sich daraus window.location.href= "http://meineseite/adventskalender/tag-5/"

Fotofreak schrieb:
Ist das mit dem oncklick im imagemap dann so richtig?
Zum Vergrößern anklicken....

Die Verlinkung zur Seite wird nach der Tag-Prüfung im Javascript gemacht. Das "href" hat also in der Area nichts verloren. Sonst sollte es passen.
 
pax schrieb:
Code: 
window.location.href= "http://meineseite/adventskalender/tag-"+today+"/"

Das ist eine Stringverknüpfung. Der Link wird automatisch zusammengebaut aus den Teilen "http://meineseite/adventskalender/tag-" , dem Tag und dem letzten Backslash. Bei Tag 5 zum Beispiel ergibt sich daraus window.location.href= "http://meineseite/adventskalender/tag-5/"

Die Verlinkung zur Seite wird nach der Tag-Prüfung im Javascript gemacht. Das "href" hat also in der Area nichts verloren. Sonst sollte es passen.
Zum Vergrößern anklicken....

Ich stehe gerade voll auf dem Schlauch! Das tut mir Leid aber bin schwer von Begriff gerade.
Wenn ich das "href" rausnehme, entferne ich doch auch mein Imagemap sozusagen?
Wenn der Link sich in der Abfrage dann automatisch zusammensetzt woher weiß das Script dann, dass es bei Tag 1 auf meine Unterseite "meineseite/adventskalender/tag1" geht und bei Tag 14 auf die Unterseite "meineseite/adventskalender/tag14"?

Könntest du mir vielleicht den vollen Code, mit der Datumabfrage und wie das Imagemap dann aussehen muss, mal schreiben? Und auch Beispielwerte eintragen?
Ich sehe gerade gar nicht mehr durch!

Danke für deine Bemühungen und das du es mit meinen dämlichen Fragen aushälst
 
Fotofreak schrieb:
Wenn der Link sich in der Abfrage dann automatisch zusammensetzt woher weiß das Script dann, dass es bei Tag 1 auf meine Unterseite "meineseite/adventskalender/tag1" geht und bei Tag 14 auf die Unterseite "meineseite/adventskalender/tag14"?
Zum Vergrößern anklicken....

Dann geh mal schlafen. Wenn das nach dem Aufstehen immer noch unverständlich ist, dann ist Programmieren einfach nichts für dich ;)
 
Werbung:
pax schrieb:
Dann geh mal schlafen. Wenn das nach dem Aufstehen immer noch unverständlich ist, dann ist Programmieren einfach nichts für dich ;)
Zum Vergrößern anklicken....

Ich bin kein großer Programmierer, das ist mir bewusst. Und bis ich hinter einige Dinge steige dauert es auch immer etwas. Doch leider bleibt mir nicht mehr so viel Zeit bis der erste Dezember ist. Und ich würde es gerne fertigstellen.
Ich habe schon so viel Zeit investiert und möchte es jetzt nicht aufgeben und würde mich über weitere Hilfe freuen.
Habe nun alles so, wie du es gesagt hast aber es funzt nicht. Also so sieht es jetzt aus:
Code: 
<script type="text/javascript">
//<![CDATA[
function checkdate(tag)
    {
        var date = new date();
        var today= date.getDate();
        if (today == date)
        {
            window.location.href= "http://www.meineseite.de/adventskalender/tag-"+today+"/"
        }
        else
        {
            alert ("Wer will da schummeln?")
        }
    }
//]]>
</script><img src="http://www.meineseite.de/std/image.jpg" border="1" alt="Adventskalender" usemap="#Kalender" /> <map name="Kalender" id=
"Kalender">
    <area shape="rect" coords="0,0,110,100" onclick="checkdate (1)" alt="Advent 1" />

Klicke ich auf die 1 in meinem Kalender passiert nichts.
Noch eine Verständnisfrage, muss ich dann für jedes Türchen diese Schleife erstellen? (wenn es für eines funktioniert)
 
pax schrieb:
Zu allererst musst du deutlich sorgfältiger auf deinen Code achten!
Code: 
window.location.href= "http://meineseite/adventskalender/tag-"+today+"/"
Zum Vergrößern anklicken....
Ich denke eher du meinst:
Code: 
window.location.href= "http://meineseite/adventskalender/tag-"+tag+"/"

Sonst wird ja unabhängig vom geklickten tag immer der aktueller today aufgerufen.
 
Werbung:
So?

Code: 
<script type="text/javascript">
//<![CDATA[
    function checkdate(tag)
    {
        var date = newDate();
        var today= date.getDate();
        if (today == date)
        {
            window.location.href= "http://www.meineseite.de/adventskalender/tag-"+tag+"/"
        }
        else
        {
            alert ("Wer will da schummeln?")
        }
    }
//]]>
</script><img src="http://www.meineseite.de/std/image.jpg" border="1" alt="Adventskalender" usemap="#Kalender" /> <map name="Kalender" id=
"Kalender">
    <area shape="rect" coords="0,0,110,100" href="" onclick="checkdate (1)" alt="Advent 1" />
 
Werbung:
Ok aber das würde nicht im sinne eines Adventskalender sein ich möchte ja am 4.12. auch das Türchen von 2.12. öffen können um an die vergessene Schokolade zu kommen :D

Ungetestet:
Code: 
<script type="text/javascript">
function checkdate(selectday) {
    console.log ('Funktion checkdate wurde aufgerufen.');
    var dateselect = new Date (2014, 11, selectday);
    var datenow = new Date();
    if (datenow > dateselect) {
        console.log ('Weiterleitung');
        window.location.href= "http://www.meineseite.de/adventskalender/tag-"+selectday+"/";
    } else {
        console.log ('Zugriff verweigert.');
        alert ("Wer will da schummeln?");
    }
}
</script>
<img src="http://www.meineseite.de/std/image.jpg" border="1" alt="Adventskalender" usemap="#Kalender" /> 
<map name="Kalender" id="Kalender">
    <area shape="rect" coords="0,0,110,100" onclick="checkdate(1)" alt="Advent 1" />
</map>
 
bodo92 schrieb:
Ok aber das würde nicht im sinne eines Adventskalender sein ich möchte ja am 4.12. auch das Türchen von 2.12. öffen können um an die vergessene Schokolade zu kommen
Zum Vergrößern anklicken....
In Ordnung :)

@Fotofreak:

da steht immer noch "if (today == date)".

Wo zur Hölle nimmst du das her? Liest du auch, was hier geschrieben wird? Konzentrier dich mal ein bisschen.
 
pax schrieb:
Zu allererst musst du deutlich sorgfältiger auf deinen Code achten!

ist falsch. "=" ist ein Zuweisungsoperator. Du gibst der variable today damit den wert von tag. Das hat in einer If-Abfrage nichts verloren. Der Vergleichsoperator ist "==".
Zum Vergrößern anklicken....

Ich habe es da her genommen! Das hast du vorhin so geschrieben?
@bodo92
Danke soweit funktioniert es, also wenn ich auf die 14 klicke, dann kommt "Wer will da schummeln", doch danach öffnet sich dann die Seite des 14 Türchens.
Wie kann ich das verhindern?
 
Werbung:
ich denke mal spontan du hast im imagemap noch nen href oder?
Und die Zeilen mit console.log kannst du entfernen..
 
bodo92 schrieb:
ich denke mal spontan du hast im imagemap noch nen href oder?
Und die Zeilen mit console.log kannst du entfernen..
Zum Vergrößern anklicken....

Nein habe ich nicht, das habe ich schon überprüft.
So sieht es aus:
Code: 
<script type="text/javascript">
//<![CDATA[
function checkdate(selectday) {
    var dateselect = new Date (2014, 11, selectday);
    var datenow = new Date();
    if (datenow > dateselect) {
                window.location.href= "http://www.homepage.de/adventskalender/tag-"+selectday+"/";
    } else {
                alert ("Wer will da schummeln?");
    }
}
//]]>
</script><img src="http://www.homepage.de/std/image.jpg" border="1" alt="Adventskalender" usemap="#Kalender" /> <map name="Kalender" id=
"Kalender">
    <area shape="rect" coords="0,0,110,100"  onclick="checkdate (1)" alt="Tag 1" />
    <area shape="rect" coords="111,0,210,100" onclick="checkdate (14)" alt="Tag 14" />
 
Und bei Türchen 1 kommt weder ne Meldung noch geht er auf eine Unterseite, es wird einfach an den Anfang der Seite gesprungen.
 
Werbung:
Sollte eigentlich so passen.. @pax hast du ne Ahnung?
Verwendest du XHTML weil du CDATA-Tag verwendest. In HTML kannst dir das schenken.

Das ganze Script nützt dir aber nichts wenn du deine Bilder so speicherst.. wenn ich die Bild-URL im Browser von Tag-1 auf Tag-24 ändere ist bei mir schon Heiligabend :D
Hier würde ich einfach per JS irgendwie eine zahl berechnen und als Bild-Name verwenden..

//EDIT:
Hast du das Online über einen Link könnte man das Problem sicher finden..
 
Das ist nur ein Foto, welcher der Kalender ist und darauf sind dann 24 Imagemaps erstellt. Die normalerweise auf die jeweilige Unterseite verlinken.
Doch das "href" habe ich ja entfernt.
CDATA nehme ich dann noch raus.
Du hast geschrieben die Bilder, geht das nur mit mehren Bildern?
Oder ist das alles so ok wie ich es habe?
Also tag1 und tag 14 war nur ein Auszug aus all den 24 koordinaten und Co.
 
Du musst dich einloggen oder registrieren, um hier zu antworten.

Neueste Beiträge

Zurück
Oben