Einem Button mehrere Funktionen zuweisen (Popup Eben + Anker)

ammerseearts schrieb am 04.03.2012 um 21:27 Uhr

Hallo zusammen,

 

ich hätte da eine Frage - beziehe mich hier auf Web Designer 7.

Ich habe auf meiner HP mehrere Buttons, die eine Popup Ebene öffnen. Da die Ebene etwas weit unten auf der Seite liegt und bei kleinen Monitoren somit nicht direkt zu sehen ist, würde ich dem Button gerne die zusätzliche Funktion geben, auf einen Anker auf der Seite zu verlinken (zu scrollen).

Die Funktionene einzeln sind überhaupt kein Problem - also Popup o. Anker. Wie kann ich aber dem einen Button diese beiden Funktionen zuweisen ? (Viel. gibt es hierfür einen Code o. ähnliches - über Webeigenschaften kann ich ja immer nur eine Funktion definieren o. ?)

 

Wäre super, wenn mir hierbei wer helfen könnte.

Kommentare

BeRo schrieb am 04.03.2012 um 21:44 Uhr

[...] gibt es hierfür einen Code o. ähnliches [...]

Sicher wäre es möglich, über den Button ein geeignetes Script zu starten, das seinerseits dafür sorgt, die popup Ebene in den sichtbaren Bereich zu verlagern, etc.

Andererseits ist es sehr viel einfacher, die Einblendung der popup Ebene direkt in den auch bei kleinen Bildschirmen immer sichtbaren Bereich des Browserfensters zu legen.

Dazu schiebst Du den Inhalt der popup Ebene einfach weiter nach oben...

Wenn das Dein Problem nicht löst- oder ich Deine Frage falsch verstanden habe, melde Dich einfach nochmal...

Zuletzt geändert von BeRo am 04.03.2012, 21:44, insgesamt 1-mal geändert.

Auf den Tag genau gehen heute, am 14.08.2021, 10 Jahre online Support für die Community zu Ende.
Ich freue mich auf eine neue, berufliche Herausforderung, die sich gerade ergeben hat. Leider bleibt dann keine Zeit mehr für die Community übrig, aber Ihr seid bei den aktiven Mitgliedern in besten Händen.
Sicher schaue ich auch ab und zu nochmal rein... 🤓

ammerseearts schrieb am 04.03.2012 um 22:19 Uhr

Danke ersteinmal für die Antwort...

Mein Problem ist allerdings, dass ich die Pop-Up Ebene gerne an besagter Stelle lassen würde, da ich sonst Probleme mit meinem kompletten Design bekomme.

Ich hab die Website eigentlich schon größtenteils fertig - ich habe eben auf besagter Seite ein video eingebunden, die buttons sind bilder in der Höhe des Players, die nachdem schließen des videos zu sehen sind...und durch anklicken dieser Bilder wird darunter ein entsprechender Text angezeigt (die Popup Ebene)

Ich hätte eben einfach gerne, dass beim anklicken eines der Bilder, der Browser auf einen Anker etwas weiter unten springt/scrollt (zusätzlich dazu, dass das anklicken die popup-ebene öffnet) - auf größeren Bildschirmen (wie auf meinem hier und auch auf dem von meinem Laptop) ist die Anzeige kein Problem - daher hab ich das design eben schon so angelegt...habe eben nur beim Test auf anderen Rechnern gemerkt, dass bei einigen sehr kleinen Laptop Bildschirmen der Anwender sonst gar nicht merkt, dass bei anklicken der buttons etwas passiert...

 

Ich hoffe ich konnte ungefähr erklären, was ich meine...

Mir geht es eben wirklich um ein Script, einen Möglichkeit dem Bild (das als Button fungiert) beide Funktionen zuzuweisen:

- das Öffnen der Popup-Ebene

- und den Link auf den Anker

Ich möchte nicht, dass die Popup-Eben an sich Ihre Position ändert, die soll schon an der selben Stelle bleiben - nur soll halt der Browser, wenn der Button angeklickt wird gleich etwas nach unten scrollen.

Wär super, wenn Du mir damit helfen könntest.

BeRo schrieb am 05.03.2012 um 01:00 Uhr

[...] Mir geht es eben wirklich um ein Script, einen Möglichkeit dem Bild (das als Button fungiert) beide Funktionen zuzuweisen: [...]

Das wird ein leichte Übung.

Das Script, mit dem Du die Seite scrollen kannst, wird als Funktion im Headbereich der Seite abgelegt.

So sieht es aus:

-----------------
[script type="text/javascript">
[!--
function jumpScroll()
{window.scroll(0,700);}
-->
[/script>

----------------

Achtung! Wie immer, müssen die eckigen Klammern durch spitze Klammern ersetzt werden, bevor Du den Code "einbauen" kannst.

Es wird später über den Link mit dem Aufruf "javascript:jumpScroll()" gestartet und scrollt die Seite um so viel Pixel nach unten, wie Du im Parameter angegeben hast. Im Beispiel sind das 700 Pixel.

Jetzt musst Du noch herausfinden, welches Javascript der WD benutzt, um die von Dir gewünschte popup Ebene einzublenden.

Das geht so:



Du zeigst also auf das Objekt, das den Link zur popup Ebene trägt und siehst in der Fusszeile den Namen des Javascripts. In unserem Beispiel heisst das Script: "javascript:xr_cpu(4)"

Damit hast Du alles beisammen, was Du brauchst, um Dir Deinen Wunsch zu erfüllen

Jetzt musst Du nur noch Deinem Linkbutton (oder Bild) sagen, dass er/es die beiden Scripts nacheinander starten soll.

Dazu gibt es einen wenig bekannten Trick, den der WD erlaubt. Du schreibst die beiden Scriptaufrufe hintereinander als "Link auf Internet- oder E-Mail-Adresse" in das entsprechende Feld der Webeigenschaften für den Linkbutton (oder Bild).

In unserem Beispiel sieht das so aus: "javascript:jumpScroll(); javascript:xr_cpu(4)". Achte aber darauf, dass Du ein Semikolon als Limiter zwischen die beiden Aufrufe setzt.

Wichtig ist auch noch, dass Du die Checkbox "Automatisch korrigieren" leer lässt!

Das war's.

Den Test auf Funktionalität kannst Du schon in der Vorschau machen.

Viel Spaß noch beim weiteren Website Design

 

Zuletzt geändert von BeRo am 05.03.2012, 01:03, insgesamt 2-mal geändert.

Auf den Tag genau gehen heute, am 14.08.2021, 10 Jahre online Support für die Community zu Ende.
Ich freue mich auf eine neue, berufliche Herausforderung, die sich gerade ergeben hat. Leider bleibt dann keine Zeit mehr für die Community übrig, aber Ihr seid bei den aktiven Mitgliedern in besten Händen.
Sicher schaue ich auch ab und zu nochmal rein... 🤓

ammerseearts schrieb am 06.03.2012 um 19:44 Uhr

Danke Dir erstmal wieder für die seeeeeeeeeehr schnelle und ausführlich Antwort.

Das ist im Grunde genau das was ich wollte.

Nur leider klappt´s bei mir einfach nicht -.-

Das JumpScroll-Script im Head einfügen - kein Problem.

Das auslösen des Jump-Scroll-Scripts über "javascript:jumpScroll()" funktioniert auch - so lange ich in alleine in die Zeile tippe.

Der Befehl zum Aufrufen der Popup-Ebene("javascript:xr_cpu(6) - in meinem Fall) funktioniert allerdings überhaupt nicht - nichteinmal wenn ich in alleine in die Linkzeile setze. Habe die Nr. und Schreibweise mehrfach geprüft und es auch mit verschiedenen Ebenen versucht. Will einfach nicht klappen...

 

Na,ja - dann hab ich´s hinbekommen die Popup-Eben über den Befehl: popup:"Name der Ebene" zu öffnen - aber auch nur wenn ich diesen allein in die Zeile tippe - zusammen mit dem jumpScroll Befehl funktioniert auch dieser nicht -.-

 

Kein Plan, was ich falsch mache...habe es schon mit bieden befehlen (popup o. javascrip:xr_cpu) versucht...habe das jumpScroll davor oder dahinter geschrieben....

Hier mal meine Schreibweisen:

javascript:jumpScroll();javascript:xr_cpu(6)

o.

javascript:jumpScroll();popup:"Illu_over_Text"

 

Ich trenne die Befehle per semicolon (dem Ding da >>> ;), ich habe auto korrigieren aus, der Befehl den ich bei xr_cpu() einsetze ist derselbe der angezeigt wird, wenn ich es als popup ebene einstelle...ich schreib´s in den richtigen Reiter (Link auf Internet o. E-Mail Addresse)...

 

nix funzt...hab´s jetzt auch nochmal mit einer komplett neu erstellten Testpage probiert...won´t work.

 

Viel. noch ne Idee was ich falsch machen könnte ?

Du hast das ganze in Web Designer 7 getestet o. ?

 

Was mich eig. am meisten wundert ist, dass der befehl: javascript:xr_cpu(6) einfach mal überhaupt nicht funktioniert...obwohl genau das selbe links unten angezeigt wird, wie wenn ich das ganze über den Reiter Popup-Ebene einstelle...

BeRo schrieb am 06.03.2012 um 21:38 Uhr

[...] Viel. noch ne Idee was ich falsch machen könnte ? [...]

So, wie Du Deine Vorgehensweise beschreibst, scheint alles richtig zu sein.

[...] Du hast das ganze in Web Designer 7 getestet o. ? [...]

Ja, genauer gesagt im WD7 premium. Aber das muss in allen Versionen funktionieren.

Öffne mal hier die online gestellte Demo. Die sollte in allen halbwegs modernen Browsern fehlerfrei funktionieren.

Die komplette WD Projektdatei kannst Du Dir hier herunterladen, für eigene Experimente.

Mal sehen, ob Du damit das Problem in den Griff bekommst...

Viel Erfolg

P. S.
Die Dateien zu den o. a. Links nehme ich nach ca. 4 Wochen wieder vom Netz  (Platzgründe)
Wer danach noch Bedarf hat, der kann mir gerne eine PN schreiben.

Zuletzt geändert von BeRo am 06.03.2012, 21:41, insgesamt 2-mal geändert.

Auf den Tag genau gehen heute, am 14.08.2021, 10 Jahre online Support für die Community zu Ende.
Ich freue mich auf eine neue, berufliche Herausforderung, die sich gerade ergeben hat. Leider bleibt dann keine Zeit mehr für die Community übrig, aber Ihr seid bei den aktiven Mitgliedern in besten Händen.
Sicher schaue ich auch ab und zu nochmal rein... 🤓

ammerseearts schrieb am 07.03.2012 um 03:14 Uhr

Echt vielen Dank nochmal für die Hilfe...

Deine Projektdateien haben bei mir einwandfrei funktioniert.

Hab´s auch bei meiner Website dann hinbekommen...kapier zwar immer noch nicht wieso und warum - hatt nämlich alles eig. erstmal nicht geklappt - hab auch das script mit den beiden funktionen aus deiner version 2 versucht...ging nix. Dann hab ich über meine eigentlichen Buttons nochmal ein Rechteck gelegt mit 100% Transparenz, dem hab ich dann das Javascript im Link zugewiesen und bam es funktioniert. Kann´s mir nicht erklären, aber na,ja es funktioniert jetzt ^^

Danke nochmal für Deine Super Hilfe!

 

(Sobald die Page komplett online ist, schick ich Dir mal nen Link, dann kannst Du Dir al das Ergebniss anschauen^^)