SUCHE: Fliegender Kontakt Button rechts

graphys

Hi,

kann jemand ein Plugin empfehlen mit dem die Erstellung eines Kontakt Buttons möglich ist?
Der Button soll auf dei Kontakt Seite verlinken, rechts in der Website "schwimmen" und beim Scrollen stets sichtbar bleiben.

Greetz
graphys

Werbepost

Hallo!

Wenn du gerade an deiner Website arbeitest oder dein aktuelles Hosting überdenkst: Wir betreiben mit NetzLiving eine Hosting-Plattform, die speziell auf Performance, Sicherheit und einfache Verwaltung ausgelegt ist.

✔️ Schnelle Ladezeiten (optimiert für WordPress & Co.)
✔️ Deutsche Server & DSGVO-konform
✔️ Persönlicher Support (kein 0815-Ticket-System)

Mehr erfahren

mwteam

google mal 2sec arbeit so was kann mann mit scrollTop machen.

aber für dich auch hir:
nach <body> einfügen:

Code

<a href="http://mysite.de/kontakt" class="kontakt">Kontakt</a>

CSS

Code

.kontakt{
    width:100px;
    height:130px;
    padding:10px;
    text-align:center;
    background: whiteSmoke;
    font-weight: bold;
    color: #444;
    text-decoration: none;
    position:fixed;
    top:75px;
    right:40px;
    display:none;
    background: url('kontakt.png') no-repeat 0px 20px;
}
.kontakt:hover{
    text-decoration:none;
}

Alles anzeigen

Jquery:

Code

$(document).ready(function(){
    //Check to see if the window is top if not then display button
    $(window).scroll(function(){
        if ($(this).scrollTop() > 100) {
            $('.kontakt').fadeIn();
        } else {
            $('.kontakt').fadeOut();
        }
    });
    //Click event to scroll to top
    $('.kontakt').click(function(){
        $('html, body').animate({scrollTop : 0},800);
        return false;
    });
});

Alles anzeigen

graphys

Hi,
danke für Deine hilfreiche Antwort.
Womit baue ich den Code über das Wordpress Dashboard ein und in welche php Datei?

Thx
graphys

Zitat von mwteam

google mal 2sec arbeit so was kann mann mit scrollTop machen.

aber für dich auch hir:
nach <body> einfügen:

Code

<a href="http://mysite.de/kontakt" class="kontakt">Kontakt</a>

CSS

Code

.kontakt{
    width:100px;
    height:130px;
    padding:10px;
    text-align:center;
    background: whiteSmoke;
    font-weight: bold;
    color: #444;
    text-decoration: none;
    position:fixed;
    top:75px;
    right:40px;
    display:none;
    background: url('kontakt.png') no-repeat 0px 20px;
}
.kontakt:hover{
    text-decoration:none;
}

Alles anzeigen

Jquery:

Code

$(document).ready(function(){
    //Check to see if the window is top if not then display button
    $(window).scroll(function(){
        if ($(this).scrollTop() > 100) {
            $('.kontakt').fadeIn();
        } else {
            $('.kontakt').fadeOut();
        }
    });
    //Click event to scroll to top
    $('.kontakt').click(function(){
        $('html, body').animate({scrollTop : 0},800);
        return false;
    });
});

Alles anzeigen

hape13

Zitat von graphys

Hi,
kann jemand ein Plugin empfehlen mit dem die Erstellung eines Kontakt Buttons möglich ist?
Der Button soll auf dei Kontakt Seite verlinken, rechts in der Website "schwimmen" und beim Scrollen stets sichtbar bleiben.
Greetz
graphys

Hallo graphys,

gerade eben habe ich eine ähnliche Frage beantwortet, könnte auch für Dich das sein, was Du suchst.

Schaust du...

[COLOR=#0000ff]HIER[/COLOR]

Cheers,

hp.

graphys

Zitat von hape13

Hallo graphys,
gerade eben habe ich eine ähnliche Frage beantwortet, könnte auch für Dich das sein, was Du suchst.
Schaust du...
[COLOR=#0000ff]HIER[/COLOR]
Cheers,
hp.

Alles anzeigen

Cool! Das ist genau das was ich gesucht habe...
Thx!

Willkommen! Melden Sie sich an oder registrieren Sie sich.

SUCHE: Fliegender Kontakt Button rechts

Jetzt mitmachen!