Nicht mehr ganz neu hier
Hallo zusammen,
würde gern für unseren club auf der Website ein kleines gewinnspiel einbauen.
Es soll ein klassischer zufallsgenerator sein den ich aber gerne prozentual beeinflussen möchte. Zu gewinnen gibt es quasi einen Freien Eintritt in den Club.
Ich bin zwar schon auf etwas gestoßen, weis aber nicht obs da richtige ist:
den code hier (http://htmledit.squarefree.com/) einfach mal einbauen damit ihr sehn könnt was passiert.
und folgende schritte dachte ich mir noch zusätzlich:
+ eine stelle im code wo ich den prozentualen wert festlegen kann
+ eine 24std ip-sperre
+ eine mail soll an mich geschickt werden mit der ip und der emailadresse des gewinners (diese soll natürlich nirgend gespeichert werden, da es sonst Rechtlicher dinge benötigt)
+ wenn jemand gewonnen ha, soll ein popup aufgehen indem man seine e-mail adresse eingibt. Derjenige erhält dann eine eMail mit einer Karte die ausgedrukt werden soll. Auf der Karte muss ein code abgebildet werden z.b. seine ip-adresse, die ich dann im Club vergleichen kann
ich weis das ist etwas sehr viel, aber kann ich diesen code dafür gut benutzen oder muss ich mit php und eine mysql arbeiten.?
gruß Tomas
würde gern für unseren club auf der Website ein kleines gewinnspiel einbauen.
Es soll ein klassischer zufallsgenerator sein den ich aber gerne prozentual beeinflussen möchte. Zu gewinnen gibt es quasi einen Freien Eintritt in den Club.
Ich bin zwar schon auf etwas gestoßen, weis aber nicht obs da richtige ist:
HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>Zufallsgenerator</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<!-- jQuery einbinden -->
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript">
/* Wenn der Body geladen ist werden die enthaltenen Funktionen ausgeführt.
$(document).ready(function(){ ... }); Alle in dieser enthaltenen Funktionen werden entsprechd erst bei geladenem Body ausgeführt */
$(document).ready(function(){
/* Der Button mit der id #auslosungstarten wird mit einer click Funktion belegt. */
$('#auslosungstarten').click(function(){
/* Der Button selbst wird ausgeblendet */
$(this).hide('slow');
/* Ein Interval wird gestartet und die Funktion auslosung() alle 300 Milisekunden ausgeführt */
intVal = window.setInterval("auslosung()", 100);
/* Nach 30 Sekunden wird der Gewinner gezogen */
window.setTimeout("winneris()", 3000);
/* return false verhindert, dass der href des Links aufgerufen wird */
return false;
});
auslosung = function(){
/* member enthält die Anzahl der Teilnehmer der Verlosung */
member = $('.member li').length;
/*
Math.random() generiert eine Zufallszahl.
Diese mit den Teilnehmern multipliziert ergebit den index Wert eines der Teilnehmer.
*/
randNum = Math.floor(Math.random()*member);
/* Die CSS Klasse "win" wird von allen li's entfernt und ... */
$('.member li').removeClass('win');
/* ... für den durch die Zufallszahl gewählten Teilnehmer neu gesetzt */
$('.member li:eq('+randNum+')').addClass('win');
/* Diese Funktion wiederholt sich alle 300 Milisekunden.
Dadurch entsteht das Muster, dass immer ein anderer Teilnehmer markiert wird.
*/
}
winneris = function(){
/* Nachdem 30 Sekunden lang zufällige Teilnehmer markiert wurden, wird der Intervall nun beendet */
clearInterval(intVal);
/* Der zuletzt markierte Teilnehmer wird nun als Gewinner gezogen */
winner = $('.member li.win').html();
/* Der Gewinner wird in der #andthewinneris ausgegeben. */
$('#andthewinneris').html('Status: <strong>'+winner+'<\/strong>');
}
});
</script>
<style type="text/css">
/* Das ist der CSS Code zum Verlosungs-System und bedarf meiner Meinung nach keiner weiteren Erklärung */
*{outline:none;padding:0px;margin:0px;}
body{padding:40px;font:14px "Myriad Pro";color:#333;}
h1{margin-bottom:20px;font-size:26px;font-weight:normal;}
.member{list-style:none;width: 100%;}
.member li{padding:10px;width:160px;background:#efefef;border:1px solid #ddd;margin:0 10px 10px 0;float:left;text-align:center;}
.member li.win{background:#fff9d7;border:1px solid #e2c822;}
#auslosungstarten{padding:10px;width:160px;background:#f24f04;border:1px solid #c13d00;margin:0 10px 10px 0;float:left;text-align:center;font-weight:bold;text-decoration:none;display:block;color:#fff;margin-top:40px;}
#andthewinneris{margin-top:40px;font-size:26px;font-weight:normal;color: #f24f04;}
</style>
</head>
<body>
<h1>Gewinnspiel</h1>
<!-- Dashier ist die Liste der Teilnehmer von der Verlosung -->
<ul class="member">
<li>fail</li>
<li>fail</li>
<li>Freier Eintritt</li>
<li>fail</li>
</ul><br clear="all" />
<!-- Button zum starten der Verlosung -->
<a href="#" id="auslosungstarten">Auslosung starten...</a>
<!-- Ausgabe des Gewinners: -->
<h1 id="andthewinneris"></h1>
</body>
</html>und folgende schritte dachte ich mir noch zusätzlich:
+ eine stelle im code wo ich den prozentualen wert festlegen kann
+ eine 24std ip-sperre
+ eine mail soll an mich geschickt werden mit der ip und der emailadresse des gewinners (diese soll natürlich nirgend gespeichert werden, da es sonst Rechtlicher dinge benötigt)
+ wenn jemand gewonnen ha, soll ein popup aufgehen indem man seine e-mail adresse eingibt. Derjenige erhält dann eine eMail mit einer Karte die ausgedrukt werden soll. Auf der Karte muss ein code abgebildet werden z.b. seine ip-adresse, die ich dann im Club vergleichen kann
ich weis das ist etwas sehr viel, aber kann ich diesen code dafür gut benutzen oder muss ich mit php und eine mysql arbeiten.?
gruß Tomas
