Website verschiebt sich beim scrollen, wie kann ich es lösen?

Wenn ich auf dem Iphone auf meiner Website scrollen möchte, dann wische die ganze zeit rechts und Links aus dem bild raus. Kann mir einer Erklären wie ich dieses Problem beheben kann.

Danke im Vorraus.

MfG

2 Antworten

Vom Fragesteller als hilfreich ausgezeichnet

Steffile

31.08.2023, 11:49

Korrekt waere dsa Element zu finden das den overflow veruracht, z.B. ein Bild mit negativem margin-left oder-right, und zu korrigieren.

Schneller ist folgendes, kann bloss probleme bereiten wenn du auf rechts-links-scrollen angewiesen bist:

body, html {overflow-x: hidden}

sushi564

31.08.2023, 11:48

Rauszoomen mit beiden Fingern bis du anstehst.

Schalte aber die Hochformat Sperr-funktion im Kontrollzentrum ein, da es sich zurücksetzt und reinzoomt, wenn du im Querformat landest ;)

Woher ich das weiß:eigene Erfahrung – Ich denke logisch :)

Guten Abend,

ich bin zurzeit an einem kleinem fiktivem Projekt. Da ich die meiste Zeit desktop-first entwickle, gehe ich das Projekt diesmal mobile-first an. Ich benutze nextjs + tailwindcss.

Auf Bild 1 ist die Frontpage zu erkennen. Erstmal nichts spektakuläres bzw. relevantes für meine Fragestellung.

Auf Bild2 ist ein Prototyp zu sehen, welchen ich im ersten Gedankengang hatte. Mein Vorhaben ist folgendes:

Links von der Frontpage soll die Navigation liegen.

Klickt der User auf einen Burger-Menu Button , verschiebt sich der geamte Screen um die Breite, der Navigation nach rechts. Das ganze soll natürlich schön animiert sein.

Mein erster Prototyp hat die Navigation und die Frontpage absolut gesetzt bekommen. Das Problem an der Sache ist, dass das seitliche scrollen auf dem Handy dann noch möglich ist. (Soweit ich weiß ist es schwierig, dieses auf mobile Screens zu deaktivieren?, korrigiert mich, falls ich da falsch liege).

Habt ihr andere Ansätze wie man das ganze lösen kann?

...zur Frage

Wie in einer HTML Website Text neben ein Bild machen?

Hi, ich programmiere gerade für eine Präsentation in der Schule eine Mini Website. Ich mach mal ein Bild vom Code des Bildes und von der ausgeführten Seite.

Ich will, dass das Bild rechts ist und links der Text, ohne das genau neben dem Bild Platz ist.

...zur Frage

Hallo, wieso verschiebt sich die Nachfragekurve nach links oder rechts?

...zur Frage

Website HTML und CSS Fehler?

Hallo,

ich soll als Hausaufgabe eine Website (nur HTML und CSS) programmieren (wir haben bis jetzt nur die Basics gemacht).

Ich habe nun die Grundstruktur in HTML so gemacht, wie ich es brauche und bin nun beim CSS Teil angekommen, welcher mir etwas Kopfschmerzen bereitet.

Ich habe mal Screenshots vom bisherigen Code eingefügt (Die Website soll laut Lehrer ganz einfach sein, das Impressum muss nur einen Beispieltext enthalten und den Code für den footer aus der Landingpage habe ich noch nicht an die anderen Seiten angepasst, da ich noch mit CSS am experimentieren war).

Falls der Code an sich besser weiterhilft, habe ich hier noch den Dropbox Link:
https://www.dropbox.com/scl/fi/fgwyg3w7m4hfqdnbl3f3n/Website.zip?rlkey=1ea3d4quzggbn8xgnk9x9gvk3&dl=0

Nun habe ich folgende Probleme/Dinge, die ich auf der Website haben möchte, aber nicht hinbekomme:

Ich möchte einen festen Header haben (wie der auf gutefrage), bei welchem die anderen Seiten mittig angeordnet sind
Der footer soll wie bei Amazon ganz unten sein und auch in einem farbigen Kasten, welcher sich über den ganzen Bildschirm zieht
Die Texte im Footer sollen einmal links(2023), mittig(impressum) und rechts(Namen) ausgerichtet sein (irgendwie konnte ich den Link zum Impressum nicht verschieben)
Die Seite muss nicht 100% responsible sein, sondern soll sich nur an verschiedene Browser anpassen (Laut Lehrer mit Hilfe von prozentualen Werten anstatt Pixeln)
Auf der Landingpage möchte ich das Hintergrundbild haben und der Text (welchen ich noch hinzufügen muss) soll erst nach dem Bild kommen, wenn man runter scrollt
Auf der Impressum Seite soll der Beispieltext zum Uhrheberrecht nicht von ganz links nach ganz rechts auf dem Bildschirm gehen, sondern nur bis zu etwa der Mitte und dann einen Zeilenumbruch (soll sich nicht verschieben, wenn ich es mit anderem Browser benutze)

Ich habe schon selbst versucht, die oben genannten Dinge irgendwie zu fixen, aber entweder klappt es nicht oder meine Website stellt sich einmal auf den Kopf. Da wir auch erst die Basics in CSS hatten, weiß ich leider nicht mehr, als das, was ich schon gemacht habe.

Es wäre sehr hilfreich, wenn mir einer, der sich damit auskennt, weiterhelfen könnte und mir erklären kann, wie ich die oben genannten Kriterien umsetzen kann.

Ich bedanke mich schonmal sehr bei euch.

Grüße Alex

...zur Frage

Wie findet ihr diese Website?

Moin,

anbei die wie schon gesagte Website in 1.1 Version

wer sich fragt was oder wie oder wo -> in meine Fragen schauen

https://rgbibelofficial.de/?

also wie findet ihr sie ansich

...zur Frage

Wie schalte ich diese Funktion ab WP Elementor?

Hi, auf meiner Webseite habe ich ein Bild reingestellt das vom rechten Rand bis in die Mitte raus ragt, allerdings wenn ich das Fenster kleiner mache kann man nach rechts scrollen da das Bild außerhalb des Sicht Feldes ist, das darf gar nicht sein, gibt es dafür vielleicht ein Plugin oder wie bekomme ich das weg?

Hier noch mal ein Video um es genauer zu erklären...

https://www.youtube.com/watch?v=m4ogKuqiaFw

...zur Frage

Link Ziel verstecken?

Hey, bin gerade dabei eine Website zu erstellen nur nervt es mich das bei einfachen sachen wie Verlinkungen auf der seite das unten Links angezeigt wird und weiß leider nicht wie ich das verhinder, habe schon ein paar Möglichkeiten probiert leider hat noch nichts geklappt. :/

MfG

...zur Frage

Panorama Bild wie bei Google Maps?

Hi,

Ich habe folgenden Code:

HTML:

<div id="panorama-container">
  <img src="https://media04.meinbezirk.at/article/2016/10/31/6/9445226_XXL.jpg" id="panorama-image" />


  <a href="#" id="fullscreen-button">Vollbildschirm</a>
</div>

CSS:

html, body {
  margin: 0;
  padding: 0;
  height: 100%;
  max-width: 100%;
  overflow: hidden;
}


#panorama-container {
  width: 100%;
  height: 100%;
}


#panorama-image {
  position: absolute;
  left: 0;
  top: 0;
  height: 100%;
  max-width: auto;
  overflow-y: hidden;
}


#fullscreen-button {
  position: absolute;
  top: 20px;
  right: 20px;
  font-size: 16px;
  color: #fff;
  text-decoration: none;
}

JS:

var panoramaContainer = document.getElementById("panorama-container");
var panoramaImage = document.getElementById("panorama-image");
var fullscreenButton = document.getElementById("fullscreen-button");
var position = 0;
var initialX = null;


fullscreenButton.addEventListener("click", function() {
  if (panoramaContainer.requestFullscreen) {
    panoramaContainer.requestFullscreen();
  } else if (panoramaContainer.webkitRequestFullscreen) {
    panoramaContainer.webkitRequestFullscreen();
  } else if (panoramaContainer.mozRequestFullScreen) {
    panoramaContainer.mozRequestFullScreen();
  } else if (panoramaContainer.msRequestFullscreen) {
    panoramaContainer.msRequestFullscreen();
  }
});


document.addEventListener("touchstart", function(event) {
  initialX = event.touches[0].clientX;
});


document.addEventListener("touchmove", function(event) {
  if (initialX === null) {
    return;
  }


  var currentX = event.touches[0].clientX;
  var diffX = currentX - initialX;
  initialX = currentX;


  movePanorama(diffX); /* Change this value to adjust the speed of the movement */


  event.preventDefault();
});


document.addEventListener("touchend", function() {
  initialX = null;
});


function movePanorama(amount) {
  position += amount;
  panoramaImage.style.left =        position + "px";


 
  
}

Nun wird zwar das bild wie bei Google maps angezeigt, also genauer gesagt möchte ich das wenn ich auf meinem Bild nach links wische, dass es sich nach links dreht und rechts genau so. Das Problem ist nur wenn ich zu weit Wische, zeigt er mir ein weißen Screen, aber wie kann man das verhindern.

Vielleicht versteht ihr was ich meine

...zur Frage

Wordpress Elementorseite (Mobile Version) verschiebt sich so das ich recht einen Rand habe was tun?

Hallo zusammen

Meine Wordpress Elementor Website verschiebt sich in der Unterseite Audio RS6 auf der Mobilen Version nach links, so dass es auf der rechten Seite einen weissen Rand gibt. Langsam bin ich am verzweifeln, was kann man dagegen tun?

www.astron.ch das wäre die Website

...zur Frage

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?

...zur Frage

Wordpress richtig installieren Webseite hosten Hilfe?

Hallo Liebe Community, ich bin zurzeit dabei eine eigene Webseite zu erstellen über das Programm Wordpress, leider kenne ich mich nicht wirklich viel mit dieser Materie aus habe mir viele Tutorials angesehen die aber leider mir nicht wirklich weiterhelfen konnten. Laut meinen Recherchen soll es zwei Versionen des WordPress geben einmal die Lite Version direkt über den Browser und eine die über das Wordpress.org gedownloadet werden müsste über diese ich mehr Möglichkeiten beim individualisieren meiner page haben soll.

ich habe da ich mich nicht wirklich gut auskannte das Jahres Business Paket über die WordPress Tarife gekauft worin eine Domain und ein fertiger Host enthalten sein sollte leider wird mir in den YouTube Tutorials nur die Anleitung gezeigt wie ich durch externe databases Hosts und Domains den Download abschliesse und an der Webseite arbeiten kann.

kann mir jemand erklären wie ich die WordPress.org richtig downloade und ob dies überhaupt nötig ist? Oder reicht der normale browser oder die WP App im Microsoft AppStore.?

ich bedanke mich für eure Mühen und antworten falls ihr Tipps habt welche Videos ich mir einschalen sollte oder wenn ihr Communitys habt die ihr empfehlen könnt wo ich mich mit Gleichgesinnten austauschen kann würde es mich sehr freuen.

LG KOBAL

...zur Frage

WORD - rechts "Kopfzeile" einfügen

hallo. in word habe ich links text und möchte rechts bilder einsetzen... allerdinga verschiebt sich dann der ganze text... gibt es eine art kopfzeile für rechts? (obwohl "Kopf" dann nicht richtig ist..) oder wisst ihr anders wie das Problem zu lösen ist? wo finde ich diese einstellung?

...zur Frage

3D Datei Upload auf Website mit automatischer Preisberechnung?

Hallo, ich biete schon seit längerem einen 3D- Druck Service auf Ebay-Kleinanzeigen an, welcher sehr gut läuft. Daher möchte ich jetzt eine Website erstellen, bei der meine Kunden die Datei hochladen können und dann direkt ein Angebot erhalten. Ich habe bei mehreren verschiedenen Anbietern gesehen das, deren Upload gleich aussieht. Daher ist mir in den Kopf gekommen, dass vielleicht irgendein Tool etc. welches ich auf meiner Website einfügen kann. Leider habe ich dazu nichts gefunden. Daher wollte ich fragen, ob jemand so ein Tool kennt. Am besten wäre aber eine Shopify App.

Ich würde mich über jede Hilfe freuen!

...zur Frage

wie kann ich SSL deaktivieren?

Hallo, ich habe einen Server, aber leider nicht allzuviel erfahrung.

Ich habe versucht Mastodon zu Installieren und dabei auf Apache2 SSL Aktiviert, wohl ohne die richtigen zertifikate zu haben, und nun springt die website nicht mehr an

PHP = Funktioniert

HTML= funktioniert nicht

jemand eine idee wie ich das beheben kann, oder ist das zu kompliziert für GuteFrage?

MfG

...zur Frage

Was möchtest Du wissen?

Deine Frage stellen