Frage von XCreepX, 100

HTML Seitliches scrollen verbieten?

Hallo, ich möchte gerne bei meiner Website das seitliche scrollen verhindern. Mein Inhalt befindet sich in der mitte. In css habe ich nun overflow-x: hidden. Nun kann man nicht mehr per Scrollbar nach rechts scrollen. Wenn ich jetzt aber auf das Scrollrad klicke (mittlere Maustaste) und meine Maus nach links bewege, scrolle ich trotzdem nach rechts. Genau so auf dem Ipad. Ich kann einfach per touch nach recht scrollen. Nun möchte ich das verhindern. Kann mir jemand helfen?

Hilfreichste Antwort - ausgezeichnet vom Fragesteller
von perhp, 56

Hallo, dieses Problem mit JavaScript zu lösen ist kompletter Schwachsinn. Der Grund wieso du vertikal scrollen kannst ist, dass deine Inhalte über die 100% der Seite rausgehen. Wenn du dein Styling auf die Elemente richtig anwendest, dann benötigst du kein overflow hidden mehr.


Kommentar von XCreepX ,

Hm okay, werde ich mal machen. Danke :)

Kommentar von XCreepX ,

Funktoniert :) Danke :D

Kommentar von perhp ,

Kein Problem :) Alles was du mit CSS und HTML lösen kannst, solltest du auch damit lösen und erst wenn gar nichts mehr geht mit JavaScript.

Antwort
von iBrain, 68

Naja mit HTML kommt man da nicht mehr weit. Du kannst ein disallow mit Java machen.

$(function() {

var $body = $(document);
$body.bind('scroll', function() {
if ($body.scrollLeft() !== 0) {
$body.scrollLeft(0);
}
});

});


Kommentar von XCreepX ,

Danke :) Jetzt musst mich aber aufklären :/ Wie mache ich einen disallow wo muss ich das einfügen? :/ Habe keine Ahnung von Java.

Kommentar von iBrain ,

Das ist ein Javascript. Den fügst du ein wo du möchtest und zwar in Brackets <javascript>. Alternativ kannst du das auch in eine .js Datei einfügen und einen Dateiverweis machen aber da ich davon ausgehe das du noch nicht soweit bist füge das einfach in Quelltext ein:

<javascript>
$(function() {

var $body = $(document);
$body.bind('scroll', function() {
if ($body.scrollLeft() !== 0) {
$body.scrollLeft(0);
}
});

});
</javascript>
Kommentar von XCreepX ,

Habs eingefügt. Ich habe das Left auf Right geändert, da ich nicht nach rechts scrollen will. Jetzt funktoniert es immer noch nicht :/Ich habe es auch mit

<script type=text/javascript>

$(function() {
var $body = $(document);
$body.bind('scroll', function() {
if ($body.scrollRight() !== 0) {
$body.scrollRight(0);
}
});
});

</script>

versucht. Funktoniert aber auch nicht, genauso wie bei <javascript></javascript> :/


Antwort
von yerooke, 39

Solltest du dann nicht deine Seitenstruktur überarbeiten?

Keine passende Antwort gefunden?

Fragen Sie die Community