Stickybutton

Das Modul Sticky Button gibt es in verschiedenen Zuständen, die sich hauptsächlich im Verhalten zwischen den Screengrößen unterscheiden. Es darf nur ein Sticky Button pro Seite verwendet werden.

Um einen deaktivierten Status darzustellen, muss die Klasse disabled zusätzlich zur Klasse modul-stickybutton verwendet werden und der Button innerhalb des Moduls muss ebenfalls das Attribut disabled erhalten.

Standartmäßig ist das Modul nur auf kleinen Screengrößen Sticky, kann aber mit der Klassse permanent-sticky auch in der Desktopansicht sticky gemacht werden.

The Sticky Button module has different states, which mainly differ in terms of their behaviour on different screen sizes. Only one Sticky Button can be used per web page.

For display of a deactivated status, the class disabled in addition to the class modul-stickybutton must be used and the button within the container with the module must also have the attribute disabled.

By default this module is sticky on small screens but can be set sticky permanent by adding the class permanent-sticky.

.modul-stickybutton

Default

I am sticky only on small screend. Link

Link as Button

<div class="modul-stickybutton">
    <div class="text ">
        <p>I am sticky only on small screend. <a href="#">Link</a></p>
    </div>
    <a class="button">
        Link as Button
    </a>
</div>

Permanent sticky

.modul-stickybutton.permanent-sticky

I am permanant sticky on every screen size. Link

<div class="modul-stickybutton permanent-sticky">
    <div class="text ">
        <p>I am permanant sticky on every screen size. <a href="#">Link</a></p>
    </div>
    <button class="button">
        Button
    </button>
</div>