Vertikales Scrollen verhindern?

[haberkorn]

Hallo!

Ich hab ein Problem bei der Umsetzung einer Homepage.

Auf der rechten Seite der Webseite ragt eine Grafik in den Content mit dem Wort "Sprechzeiten".
Diese Grafik soll mithilf des hover-Effekts beim "drüberfahren" der Maus komplett in den Content ragen, sodass die Uhrzeiten angezeigt werden.
Das funktioniert auch alles soweit.
Allerdings kann man nun die Webseite horizontal scrollen, was zur Folge hat, dass man die Grafik sehen kann, was ja nicht im Sinne des Zwecks ist.

Kann mir da jemand helfen? Weiß jemand wie ich das Scrollen verhindern kann, sodass der Effekt funktioniert?


Vielen Dank im Vorraus.

 

[Banana_Jones]

Grundsätzlich kann man mit 'overflow: hidden' das Scrollen innerhalb des Element verhindern.
Ob und wie das in deinem Fall anwendbar ist, kann man ohne Quellcode bzw. Link zu deiner Seite schlecht beurteilen.

 

[haberkorn]

.sprechzeiten {
    position: absolute;
    width: 300px;
    top: -175px;
    right: -240px;
    transition: right 0.25s ease-in-out;
    -moz-transition: right 0.25s ease-in-out;
    -webkit-transition: right 0.25s ease-in-out;
    -o-transition: right 0.25s ease-in-out;
    }
    
.sprechzeiten:hover {
    right: -60px;
    transition: right 0.25s ease-in-out;
    -moz-transition: right 0.25s ease-in-out;
    -webkit-transition: right 0.25s ease-in-out;
    -o-transition: right 0.25s ease-in-out;
    }

Das Bild ist über die Artikel in Contao eingebunden,
aber so sieht der Code aus.

Ich hatte overfolw:hidden mal mit drin, aber das hat mir alles zerschossen-.-

 

[threadi]

Nimm nicht absolute sondern fixierte Positionierung.

Und bist Du sicher, dass Du vertikales Scrollen meinst? Ist es nicht eher horizontales Scrollen?

 

[haberkorn]

Das versuche ich sofort mal.

Stimmt. Natürlich meinteich das horizontale Scrollen. Sorry!

 

[haberkorn]

Bei der fixierten Position verschwindet die Grafik komplett.
Und kann der hover-Effekt dann überhaupt funktionieren?

Also so sieht es bei absolute aus: