Wie kann ich die Position der Badget-Grafik anpassen?

Standardmäßig wird die Badget-Grafik am rechten unteren Bildschirmrand angezeigt. Per CSS wird die Grafik mit einem Abstand von 2px vom rechten Bildschirmrand und 5px vom unteren Bildschirmrand positioniert. Es kann manchmal vorkommen, dass die Grafik mit ihren Standardwerten andere Objekte innerhalb Ihrer Website überlagert oder von anderen Objekten überlagert wird. Deshalb haben Sie die Möglichkeit, die Positionierung zu beeinflussen.

Der im Händlerbereich bereitgestellte JavaScript-Code zur Einbindung des Badgets beinhaltet die Funktion:

createBadget(myShopID, myBadgetType, mySrc)

Die Funktion createBadget kann mit zusätlichen vier Parametern SpaceX, SpaceY, AlignH und AlignV erweitert werden, um die Position der Grafik zu beeinflussen:

createBadget(myShopID, myBadgetType, mySrc,[[SpaceX, SpaceY, [AlignH , AlignV]], DisplayWidth])

- SpaceX entspricht dem Abstand in Pixeln vom rechten/linken Bildschirmrand
- SpaceY entspricht dem Abstand in Pixeln vom unteren/oberen Bildschirmrand
- wird SpaceX nicht angegeben, entspricht der Standardwert hierfür "right/left: 2px;"
- SpaceX darf nicht kleiner als 2 sein
- SpaceY darf nicht kleiner als 5 sein
- AlignH gibt die horizontale Ausrichtung an (gültige Werte sind 'left' oder 'right')
- AlignV gibt die vertikale Ausrichtung an (gültige Werte sind 'top' oder 'bottom')
- DisplayWidth gibt die Display-Breite in Pixeln an, bis zu der die Badget-Grafik ausgeblendet wird.
- soll DisplayWidth angegeben werden, die Parameter SpaceX, SpaceY, AlignH und AlignV aber mit den Default-Werten geladen werden, müssen die Parameter mit 0 bzw. leeren Werten übergeben werden (siehe Bsp. 6)
- werden AlignH und AlignV angegeben, müssen auch die Parameter SpaceX und SpaceY angeben werden (Sollen die Seitenabstände unverändert bleiben, können SpaceX und SpaceY mit 0 angegeben werden).

Fügen Sie also der Funktion die gewünschten Parameter hinzu, um die Position der Grafik zu beeinflussen. Lassen Sie aber den übrigen JavaScript-Code unverändert.

Anwendungsbeispiele:

1. createBadget(myShopID, myBadgetType, mySrc)

Die Parameter wurden nicht gesetzt. D.h., die Grafik wird mit den Default-Werten in einem Abstand von 5 Pixeln vom unteren Bildschirmrand und 2 Pixeln vom rechten Bildschirmrand angezeigt.

2. createBadget(myShopID, myBadgetType, mySrc, 100)

Der Parameter SpaceX wurde nicht angegeben. Es wird der Default-Wert "right: 2px;" verwendet. SpaceY hat den Wert “100″. D.h., die Grafik wird mit einem Abstand von 100 Pixeln vom unteren Bildschirmrand und 2 Pixeln vom rechten Bildschirmrand angezeigt.

3. createBadget(myShopID, myBadgetType, mySrc, 100, 100)

Die Parameter SpaceX und SpaceY haben den Wert “100″. D.h., die Grafik wird mit einem Abstand von 100 Pixeln vom unteren Bildschirmrand und 100 Pixeln vom rechten Bildschirmrand angezeigt.

4. createBadget(myShopID, myBadgetType, mySrc, 0, 0, 'right', 'top')

Die Grafik wird mit einem Abstand von 5 Pixeln vom oberen (‘top’) Bildschirmrand und 2 Pixeln vom rechten (‘right’) Bildschirmrand angezeigt.

5. createBadget(myShopID, myBadgetType, mySrc, 25, 10, 'left', 'bottom')

Die Grafik wird mit einem Abstand von 25 Pixeln vom linken (‘left’) Bildschirmrand und 10 Pixeln vom unteren (‘bottom’) Bildschirmrand angezeigt.

6. createBadget(myShopID, myBadgetType, mySrc, 0, 0, '', '', 480)

Die Grafik wird mit den Default-Werten (siehe Bsp. 1) auf Displays mit einer Display-Breite > 480 Pixeln angezeigt. Ist die Display-Breite kleiner / gleich 480 Pixeln, wird die Grafik nicht angezeigt.

Posted in: Badget-Grafik