Mein Code funktioniert nicht auf Mobile?

Hallöchen,

Ich programmiere zurzeit für ein Projekt names Lotus.

Alle Programmierer wissen sicher wie es ist, wenn etwas super auf PC ist aber unresponsive auf Mobile Geräte sind das ist mir hier unterlaufen, die Website lautet Lotushiatus.com, ich bräuchte zufällig eure hilfe, vllt weiß einer was mir da passiert ist.

20.10.2023, 17:51

Normale weise find ich sowas heraus aber meine debugkünste sind so im eimer gerad, hab gerad ne "künstlerische Blockade" so zu sagen

regex9

20.10.2023, 19:28

Beschreibe das konkrete Problem mit genauen Aussagen. Was wird erwartet und was verhält sich nicht wie erwartet?

Clunchy

Fragesteller

20.10.2023, 20:18

Der Code sollte responsive auf alle browser und geräte arten verhalten, dies ist nicht der Fall und entspricht meinem des Codes nur auf dem Chrome browser.

2 Antworten

Erzesel

Von gutefrage auf Grund seines Wissens auf einem Fachgebiet ausgezeichneter Nutzer

Programmieren & Softwareentwicklung

21.10.2023, 10:37

Naja, "künstlerische Blockade" ist wohl eine zarte Umschreibung...

Das hat durchaus das Potenzial epileptische Anfälle auszulösen... Zumindest ist das ständige "Geleier" ziemlich störend 🤢

Ganz abgesehen von der störenden "Effekthascherei" ...

...was mir da passiert ist

Copy&Paste ist Dir passiert.

Ich habe mir mal Deine css-Datei angeschaut, ein chaotisches munter zusammenkopiertes "Etwas" (ich habe mindestens 5..6 verschiedene Codeformatierungen gesehen + externe css + dynamishe Styles im Javascript)

Da brauchst du dich nicht wundern , wenn das Ding schon bei einer Größenänderung aus dem Ruder läuft. (allein >25mal legst du die Schriftgröße fest, für einige Elemente gibst Du die Größe statisch in px an, für andere in % auf die Größe des übergeordneten Elements bezogen, mal in rem (obwohl im HTML/Body-Tag gar keine Größe festgelegt wird, auf die rem reagieren müsste).

bring erstmal Ordnung in Deinen Code und schmeiß sich widersprechende Styles raus.

Responsiv bekommst Du Deine Seite nur, wenn dein CSS aus einem Guss ist und du mit wenigen kleinen Änderungen alle übrigen Elemente steuerst.

Es gibt gute gründe, weshalb Webdesigner ganz gut bezahlt werden😅

guteantwort626

21.10.2023, 15:44

Also bei mir sieht die Seite auf dem Smartphone sogar besser aus als auf dem Desktop.

etwas super auf PC ist

Das kann ich also leider nicht bestätigen.

Insgesamt ist die Seite aber leider nicht wirklich ansprechend gestaltet.

Woher ich das weiß:Hobby – Entwickle seit ca 5 J. Software in vers. Programmiersprachen

Hallöchen liebe Experten und Hobby Coder!

Ich soll für die Schule als Projekt eine Website coden. Ich würde gerne eine Website mit Rezepten, Angaben, Videos, Kommentaren,... machen. Ich habe schon im Internet gesucht, leider finde ich aber nicht wie man eine Suchleiste macht (so wie bei Google) und dass dann wenn man Enter drückt / eine "Suchen" Taste anclickt, alle Ergebnisse die diese Begriffe enthalten aufgelistet werden. Der Lehrer meinte übrigens dass man die Website gerne mit Hilfe des Internets machen darf, ihr könnt mir also ruhig helfen :).

Ich bedanke mich schon mal vorab für eure Hilfe,

Liebe Grüsse, Nicolas

(PS: es wäre mir ganz Recht wenn das ohne JS gehen würde sondern nur mit Hilfe von HTML.. (Keine Ahnung ob das geht))

...zur Frage

Element-Inhalt abrufen?

Ich programmiere seit einiger Zeit mit HTML CSS und JS und habe mit Getboostrap eine Website erstmals geschrieben, wo mein Ziel es war dass man dort einen Key eingeben kann womit man dann auf eine weitere HTML Datei umgeleitet wird die den Namen hat. Damit meine ich das wenn man als Key hallo123 eingibt das man auf die Seite Hallo.html umgeleitet wird. Ist zwar nicht gerade so sicher aber es reicht für den Start aus. Ich habe jetzt aber das Problem das ich bei "document.getElementById()" nicht dem Inhalt aus dem Eingabe Feld erhalte wodurch man egal was man eingibt zu null.html umgeleitet wird. Weiß jemand wie ich das Behebe?

<!doctype html>
<html lang="en">


<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>Mit Projekt-Key herunterladen | LSprojects</title>
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/css/bootstrap.min.css" rel="stylesheet"
        integrity="sha384-GLhlTQ8iRABdZLl6O3oVMWSktQOp6b7In1Zl3/Jr59b6EGGoI1aFkw7cmDA6j6gD" crossorigin="anonymous">
</head>
<style>
body {
    background-color: rgb(26, 24, 24);
    color: white;
}
.btn  {
    background-color: rgb(161, 156, 156);
    color: white;
}
</style>
<script>
    function submit() {
        let code = document.getElementById(codeinput);
        window.location = "/codes/" + code + ".html"
    }
</script>


<body>
    <div class="vertical-center horizontal-center">
        <h1>Geben sie den Key hier ein:</h1>
        <div class="input-group mb-3 dark-backround">
            <button href="submit()" onclick="submit()" class="btn btn-outline-secondary" type="button"
                id="load">Laden</button>
            <input type="text" class="form-control" placeholder="Projekt-Key" id="codeinput" aria-label=""
                aria-describedby="load">
        </div>
    </div>
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/js/bootstrap.bundle.min.js"
        integrity="sha384-w76AqPfDkMBDXo30jS1Sgez6pr3x5MlQ1ZAGC+nuZB+EYdgRZgiwxhTBTkF7CXvN"
        crossorigin="anonymous"></script>
</body>


</html>

...zur Frage

Wie innovative Website-Ideen (oder App-Ideen) entdecken?

Hey, ich bin 15 Jahre alt und Hobby-Programmierer. Mein Fokus in der Programmierung liegt auf Websites, oder besser gesagt der Fullstack-Web-Entwicklung (sprich: "Alles, was man sieht und nicht sieht").

Für mich ist es eigentlich ganz klar, dass ich nur Dinge programmiere/-n (kann), wenn ihr Ursprung oder die Idee dahinter interessant und innovativ ist. Ansonsten fange ich an, mich zu langweilen, und breche leider das Projekt ab.

Deswegen stelle ich mir die Frage: Wie finde/entdecke ich gute Website-Ideen (oder App-Ideen)? Etwa durch Marktnischen?

Und vielleicht, sobald ihr möglicherweise eigene gute Ideen habt und diese teilen möchtet, wäre es äußerst dankbar, wenn diese geteilt werden.

...zur Frage

Google Formulare auf Shopify für mobile Geräte einbetten?

Hi,

Ich habe ein Website bei Shopify und möchte ein Google Formular auf dieser einbetten. Das hat auch alles wunderbar geklappt über iframe, jedoch ist das Problem, dass das Google Formular für mobile Geräte komplett inkompatible auf der Seite angezeigt wird und man es nur zur Hälfte sieht. Hat jemand Ahnung wie man das richtig einbetten kann, dass es sowohl für mobile Geräte, als auch für PC etc. richtig angezeigt wird? Danke im voraus

...zur Frage

Würdet ihr dieses Projekt als "fortgeschritten" bezeichnen?

Hi! Seit einigen Jahren "lerne" ich javascript. Hab viele Pausen gehabt und nie wirklich was größeres entwickelt. Das ist mein erstes etwas grösseres Projekt, welches ein mobile game ist:

https://github.com/MyCodeNotWorking/Ballon_game

online testen (wenn ihr auf pc seid: developer tools -> in die Handy ansicht gehen -> Seite refreshen):

https://fly-balloon.netlify.app/ (ist nh absolute early development version).

Notes: ich hab kein einziges framework oder library benutzt. Alles wurde von grund auf geschrieben. Wie würdet ihr meine Kenntnisse anhand dieses githubs bewerten? Ich würde es als Anfänger-javascript einranken. Kann es halt gar nicht einschätzen, da ich noch nie wirklich "professionelles" angeschaut habe und es auch nur als hobby mache.

Mfg Weißbrot

...zur Frage

Prozentrechnen in Javascript?

Hi Leute, ich bin geradee dabei, einen Tascchenrechner zu programmiern und möchte dabei gern eine funktion zur berechnung von prozenten einbinden. (bei 350 - 10% sollte also 315 rauskommen)

kann mir da jemand weiterhelfen? Vielen Dank im Voraus

...zur Frage

Beste API Kontaktformular?

Für ein Kontaktformular für meine Webseite

...zur Frage

Auf Storrage mit Webview zugreifen?

Hallo, ich habe ein Problem und zwar ich will mit Webview, dort habe ich eine Website mit file upload. Nun wenn ich aber auf das Modul clicke um datein hochzuladen ist diese leidern icht möglich, da ich nicht in den localen Speicherort des Handys komme. Es passiert einfach nichts

...zur Frage

Frontend vs Backend?

Was findest du schwerer?

...zur Frage

iframe für mobile Geräte deaktivieren?

Hallo zusammen,

auf meiner Website blende ich am rechten Bildschirmrand ein Werbebanner ein. Dazu verwende ich ein iframe (Wordpress+Plugin). Rufe ich meine Seite über ein mobiles Gerät auf, stört mich dieser Banner allerdings. Ist es möglich den Tag so zu verändern, dass der Banner nur noch an einem Computer (desktop) nicht aber auf einem Handy (Mobile) angezeigt wird?</p> <p>Vielen Dank für die Hilfe!</p>

...zur Frage

Wieso erscheint das auf der Handy Ansicht "HTML" (Foto)?

Hallo,

ich habe auf der Wordpress-Seite eines Freundes ein Popup erstellt, wo er auf die Betriebsferien hinweist.

Auf der Desktop-Version ist alles super, jedoch kommt in der Handy-Version zwei mal "Translator"

Woran liegt das?

Der Code scheint auch zu passen.
Es erscheint immer wieder, auch wenn ich es lösche.

...zur Frage

Image maskieren in CSS?

Ich habe zwei Bilder - ein Auto und ein Sticker; der Sticker soll auf das Auto "geklebt" werden, dabei soll, wie es auch bei einem richtigen Sticker so wäre, nur das von der Seite sichtbar sein was auch auf dem Auto klebt - sprich der Sticker muss an der blauen Linie abgeschnitten werden und es darf am Ende nur das sichtbar sein was über dem blauen Strich ist. Wie könnte man das in CSS umsetzen?

...zur Frage

Gute KI um HTML-, CSS- und JS-Code für eine Webseite zu erstellen?

Hallo kennt jemand eine gute KI, um HTML-, CSS- und JavaScript-Code für eine Webseite zu erstellen?

...zur Frage

HTML code geht Button nicht?

Ich hab gerade ein Login feld mit HTML und ich will nachdem man weiter gedrückt hat das das fenster weg geht, wie kann ich das coden?

...zur Frage

Was möchtest Du wissen?

Deine Frage stellen