mediengestalter.info
FAQ :: Mitgliederliste :: MGi Team

Willkommen auf dem Portal für Mediengestalter

Aktuelles Datum und Uhrzeit: Sa 04.02.2023 10:50 Benutzername: Passwort: Auto-Login

Thema: Bei Klick DIV einblenden / über das andere DIV legen vom 14.02.2009


Neues Thema eröffnen   Neue Antwort erstellen MGi Foren-Übersicht -> Programmierung -> Bei Klick DIV einblenden / über das andere DIV legen
Seite: 1, 2  Weiter
Autor Nachricht
Rigoo
Threadersteller

Dabei seit: 14.02.2009
Ort: -
Alter: 37
Geschlecht: Männlich
Verfasst Sa 14.02.2009 16:42
Titel

Bei Klick DIV einblenden / über das andere DIV legen

Antworten mit Zitat Zum Seitenanfang

Hallo,

ein doch etwas spezielleres Problem zieht mich in diese Interessante Community! Lächel Ich konnte schon viel nützliches über die Suchfunktion finden, jedoch nichts, was mir bei meinem (speziellen) Problem weitergeholfen hat.

Folgendes soll realisiert werden:

Der Nutzer gelangt auf eine Seite, auf der ein Banner angezeigt wird (div id "klick"). Klickt der Nutzer auf diesen Banner, so soll sich die Webseite in einem neuen Fenster (möglichst im Hintergrund, wenn das überhaupt möglich ist) öffnen. Gleichzeitig soll das "klick" DIV in den Hintergrund und ein neues DIV (id "ergebnis") in den Vordergrund gerückt werden (oder besser noch, das "klick" DIV auf hidden und das "ergebnis" DIV auf visible?).

Kurz: Beim Klick auf den Banner öffnet sich eine Webseite (Sponsor) und das Ergebnis wird angezeigt. Das "klick" DIV muss dann natürlich verschwinden (die Nutzer und der Sponsor wissen, das dies ein Klickzwang ist, das ist also kein Problem).


Jemand eine Idee, wie man dies am besten realisieren könnte?

Gute Grüße,
Rigoo
  View user's profile Private Nachricht senden
sahnemuh

Dabei seit: 19.06.2003
Ort: /dev/null
Alter: 41
Geschlecht: Männlich
Verfasst Sa 14.02.2009 17:44
Titel

Antworten mit Zitat Zum Seitenanfang

Code:
<script type="text/javascript">
window.onload=function() {
   document.getElementById('klick').onclick = function() {
      this.style.display = 'none';
      document.getElementById('ergebnis').style.display = 'block';
      window.open("meinehtmldatei.html", "foo");
      self.focus();
   }
}
</script>

sollte es tun.
natürlich mußt du "meinehtmldatei.html" durch die seite, die im neuen fenster geöffnet werden soll, ersetzen.


Zuletzt bearbeitet von sahnemuh am Sa 14.02.2009 17:47, insgesamt 1-mal bearbeitet
  View user's profile Private Nachricht senden
Anzeige
Anzeige
Rigoo
Threadersteller

Dabei seit: 14.02.2009
Ort: -
Alter: 37
Geschlecht: Männlich
Verfasst Sa 14.02.2009 17:51
Titel

Antworten mit Zitat Zum Seitenanfang

Vielen dank für die schnelle Antwort.

Ich habe da leider eine wichtige Sache vergessen: Die Werbung (der Banner) wird durch einen AdServer generiert. Heisst, das die oben genannte Variante so leider nicht funktioniert.

Im AdServer hätte ich dann z.b. die Möglichkeit einem Link ein onclick zu geben, falls dies von nöten ist für das "Script".
  View user's profile Private Nachricht senden
sahnemuh

Dabei seit: 19.06.2003
Ort: /dev/null
Alter: 41
Geschlecht: Männlich
Verfasst Sa 14.02.2009 18:00
Titel

Antworten mit Zitat Zum Seitenanfang

dann machs so:
Code:
<script type="text/javascript">
function showResults(hideDIV,showDIV,url) {
      document.getElementById(hideDIV).style.display = 'none';
      document.getElementById(showDIV).style.display = 'block';
      window.open(url, "foo");
      self.focus();
}
</script>

in deine seite..

und in dein onclick schreibst du showResults('div_das_versteckt_werden_soll','div_das_gezeigt_werden_soll',url_fuer_das_neue_fenster');
  View user's profile Private Nachricht senden
Rigoo
Threadersteller

Dabei seit: 14.02.2009
Ort: -
Alter: 37
Geschlecht: Männlich
Verfasst Sa 14.02.2009 18:21
Titel

Antworten mit Zitat Zum Seitenanfang

Vermutlich bin ich einfach zu doof - aber wie würde dein fertiges HTML Dokument (beispielhaft auf google.de verlinkt) aussehen?

Bei mir klappt das leider garnicht... * Nee, nee, nee *
  View user's profile Private Nachricht senden
sahnemuh

Dabei seit: 19.06.2003
Ort: /dev/null
Alter: 41
Geschlecht: Männlich
Verfasst Sa 14.02.2009 18:34
Titel

Antworten mit Zitat Zum Seitenanfang

hast du nen link wo ich mir das ganze ansehen kann?
  View user's profile Private Nachricht senden
Rigoo
Threadersteller

Dabei seit: 14.02.2009
Ort: -
Alter: 37
Geschlecht: Männlich
Verfasst Sa 14.02.2009 18:45
Titel

Antworten mit Zitat Zum Seitenanfang

Nein, leider nicht (habe gerade keinen Zugriff auf den richtigen PC).

Bisher ist das "Projekt" auch nicht online und ich habe nur kurz offline eine .html Datei erstellt mit einem Testlink auf google - leider sind meine Javascript Kenntnisse gleich null, so das ich (auch dank deiner klasse Hilfe) mit einem großen P im Gesicht vor der Lösung stehe Menno!

Wenn ich nur erstmal sehen, wie genau ich...
Code:
<html>
<head>
<title>DIV-Test</title>
</head>
<body>
<div id="klick"><a href="http://www.google.de"><img src="banner.gif" /></a><!--Später erscheint in diesem DIV dann der AdServer Code--></div>
<div id="ergebnis">Hier erscheint das Ergebnis</div>
</body>
</html>

...umschreiben / umändern muss, damit der gewünschte Effekt einsetzt, kann ich mir daraus später auch im fertigen Projekt alles weitere "erlernen". Lächel
  View user's profile Private Nachricht senden
sahnemuh

Dabei seit: 19.06.2003
Ort: /dev/null
Alter: 41
Geschlecht: Männlich
Verfasst Sa 14.02.2009 18:52
Titel

Antworten mit Zitat Zum Seitenanfang

Code:
<html>
<head>
<title>DIV-Test</title>
</head>
<script type="text/javascript">
function showResults(hideDIV,showDIV,url) {
      document.getElementById(hideDIV).style.display = 'none';
      document.getElementById(showDIV).style.display = 'block';
      foo = window.open(url, "foo");
     foo.blur();
     window.focus();
}
</script>
<body>
<div id="klick">
   <a onclick="showResults('klick','ergebnis','http://www.o315.de'); return false" href="http://www.o315.de">
      <img src="banner.gif" />
   </a>
   <!--Später erscheint in diesem DIV dann der AdServer Code-->
</div>
<div style="display: none;" id="ergebnis">Hier erscheint das Ergebnis</div>
</body>
</html>


büdde.

€: noch mal das mit dem fokussieren richtig gemacht...


Zuletzt bearbeitet von sahnemuh am Sa 14.02.2009 19:00, insgesamt 2-mal bearbeitet
  View user's profile Private Nachricht senden
 
Ähnliche Themen div layer bei klick aus/einblenden?!
text mit javascript bei klick einblenden
Bei jedem Klick einen neuen Randomlink auf Button legen?
Kundenzugang legen
Foto um Tasse legen
Elemente Mittig Legen
Neues Thema eröffnen   Neue Antwort erstellen Seite: 1, 2  Weiter
MGi Foren-Übersicht -> Programmierung


Du kannst keine Beiträge in dieses Forum schreiben.
Du kannst auf Beiträge in diesem Forum nicht antworten.
Du kannst an Umfragen in diesem Forum nicht mitmachen.