Beiträge von AndreasB

  • navbar mit href Safari Probleme

    Hier ist es gut beschrieben: https://stackoverflow.com/ques…es-the-hover-pseudo-class
    Für iOS Safari gilt: Wenn ein HtmlElement nicht "clickable" ist, hat es auch keine Unterstützung für die Pseudoklasse :hover.


    Wenn du also ein "clickable" Element verwendest, geht's.

    Du kannst zB einen <button> verwenden.

    Oder einfach dem Element einen click Handler verpassen. Dann ist es für den Browser auch "clickable". Dafür reicht eine Zeile JS:

    JavaScript
    document.querySelector('#mobile-nav-dropdown').addEventListener('click', () => {});



    Ich würde dir aber trotzdem empfehlen, das Ganze öffnen und schließen. (das wird nämlich dann die weitere Herausforderung) mit JS zu implementieren und dich nicht auf solch hacky Lösungen zu verlassen.

    Dadurch bist du auch wesentlich flexibler, was das Verhalten angeht.

    Zitat von ny_unity

    Ich habe bisher immer js vermieden...

    Wenn du sicher gehen möchtest, dass dein UI auf allen Plattformen sauber funktioniert, kommst du an JS nicht vorbei.
    Du siehst ja, was passiert, wenn du versuchst ein einfaches Aufklappmenu nur mit CSS zu implementieren.

  • navbar mit href Safari Probleme

    Es wäre gut zu wissen, was du mit "nicht funktionieren" meinst.

    Außerdem wäre es hilfreich zu wissen, auf welcher iOS Safari Version du getestet hast.

    Und auf welchem iPhone Model du die Seite getestest hast.


    Ist die Seite öffentlich erreichbar? Wie ist denn die Adresse?

  • Skalieren des Browserfensters mit Grid

    Ich habe mir den Code angesehen, aber ich muss zugeben, dass ich nicht verstehe, was du mit

    Zitat von lady_x

    [...] Wenn ich den Browserfenster z.B. halbiere, dann rutscht alles hoch oder runter [...]

    meinst.


    Wenn du meinst, dass sich der Button und das Input-Feld überlappen, liegt das nicht an dem Grid, sondern an dem position: absolute.

    Das hat aber nix mit "hoch oder runter" zu tun.



    Übrigens:

    In dem CSS Code, den du gepostet hast, befinden sich Unerlaubte Zeichen, die im W3C Validator, zu Einlesefehlern führt:

    html-seminar.de/woltlab/attachment/2801/

    Wenn das in deiner Datei auch so ist (und dies nicht nur beim Einfügen in den Codeblock passiert ist) kann das zu unerwarteten Ergebnissen führen.

  • [OT]API von btcdirect einbinden / verwenden

    Hallo Mücke.

    Zitat von Muecke

    Ich habe keinerlei Ahnung davon :( auf von Javascript nicht.

    Dann wirst du in deinem Projekt noch eine Menge lernen.


    Zitat von Muecke

    Wenn ich das richtig verstanden habe muss ich mich um die API nutzen zu können dort erst Registrieren und benötige einen Benutzernamen und Passwort.

    Das ist Korrekt.


    Zitat von Muecke

    ich gehe mal davon aus das das selbe ist wie auf der Webseite selbst, ich bin da schon registrierter Nutzer.

    Das sehe ich auch so. Wenn du schon ein Konto hast, kannst du das schnell überprüfen.


    Zitat von Muecke

    Was ich nicht verstehe, wie soll ich mich vertraut machen mit der API ohne zu wisse welche Technologie ich verwenden muss soll?

    bei mir geht das in der Regel durch ausprobieren und schauen ob das richtige Resultat dann da ist.

    Was ich damit meine ist, dass du die API erst einmal mit Hilfe eines http Clients testen sollst (erkläre ich gleich) und dir noch nicht Gedanken über deine JavaScript / php / ... Implementation machen sollst.


    Ein HTTP Client ist ein Program mit dem man HTTP Requests abschicken kann und sich die Antwort (meinst strukturiert) ansehen kann.

    In deinem Fall dient die Dokumentation auch als HTTP Client.


    Schau dir mal die HTTP Erklärungen und das Tutorial von SelfHTML an.


    Zitat von Muecke

    In meinem Fall wäre die Vorgehensweise. [...]

    Das ist schon ein Schritt zu weit. Versuch erstmal die gewünschten Daten aus der API zu bekommen.

    Außerdem musst du dich noch mit Ajax und Asynchronem JavaScript beschäftigen.


    Zitat von Muecke

    Wenn ich mir jetzt jedoch den Punkt (API Dokumentation) Authentication anschaue: [...]

    (Was ich hier schreibe wirst du vermutlich erst verstehen, wenn du dir die SelfHTML links angeschaut hast.)

    1. Die Authentifizierung findet in der API über den Endpunkt /api/v1/authenticate statt.
    2. Diesem übergibst du im Request Body einen username und ein password.
    3. Als Response bekommst du ein Json Web Token (JWT)
    4. Diesen musst du dann bei jedem weiteren Request im Authorization-Header mitschicken: Authorization: Bearer {token}

    Das kannst du alles auf der Dokumentationsseite Testen:


    1. Klicke auf Try it out
      html-seminar.de/woltlab/attachment/2785/
    2. Trage die Daten in den Body ein
      html-seminar.de/woltlab/attachment/2786/
    3. Klicke auf Execute
    4. Dann sollte unten unter Server response der JWT angezeigt werden.



    Grüße

    Andreas.

  • [OT]API von btcdirect einbinden / verwenden

    Hallo Muecke,


    Es geht um diese API (https://api-sandbox.btcdirect.eu/api/v1/doc)?

    Zuerst wäre es Hilfreich zu wissen, wieviel Erfahrung du in der Webentwicklung hast und wie sehr du dich mit APIs auskennst.


    Für das was du vorhast gibt es viele Möglichkeiten.


    1) Ich würde vorschlagen, dich als erstes mit der API vertraut zu machen, und dir zu überlegen, wie du an die Daten Kommst, die du benötigst.

    Erstmal unabhängig von der Technologie.

    • Dafür ist die API Dokumentation sehr gut geeignet. Dort kann man auch Requests abschicken und bekommt den Response angezeigt.
    • Außerdem kann ich für erste API tests Postman empfehlen.
    • Einige verwenden auch direkt cURL
    • Oder du suchst dir einen anderen. http client.

    2) Wenn du mit der API soweit klar kommst, würde ich dir empfehlen, dir zu überlegen, ob du die Daten auf dem Server oder auf dem Client abrufen möchtest.

    Da du die Daten in einem Intervall erneut abrufen möchtest, würde ich dir empfehlen, die Daten Clientseitig mit JavaScript abzurufen.

    Dazu schau dir mal XHR und oder die FetchAPI an.



    ich hoffe das hilft dir weiter.



    Andreas

  • Variable bzw Link mehrfach

    Wenn es nur um die Tippersparnis geht, würde ich Emmet empfehlen. (Hiemit kann man man das auch einfach testen und ggf kopieren.)


    Das könnte so in etwa aussehen:

    Code
    (td>a[href="http://www.facebook.com/groups/1738406273456775/StartBild-$$"]+img[src="http://www.facebook.com/groups/1738406273456775/StartBild-$$"][alt="StartBild-$$"][style="border: none"]+br+p/)*2


    Übrigens:

    Das Offene <p> Tag ist valides HTML (das schließende </p> Tag ist an dieser Stelle optional), da es allerdings leer ist denke ich, ist das doch ein Versehen.

  • Variable bzw Link mehrfach

    basti1012 ich hatte gefragt, wie er es umsetzen will und er meinte JS. Wenn noch kein PHP Server aufgesetzt ist, ist das die einfachste Methode.

    ich weiß nicht wie seine Erfahrung in der Webentwicklung ist, und daher habe ich eine Lösung vorgeschlagen, die relativ einfach zu implementieren ist, weil sie sich an dem orientiert, dass er ohnehin schon schrieben hatte.


    Zu dem Thema aktivierten oder deaktivieren JS und der daraus folgenden Frage: Server vs. Client Side Rendering.

    Kann ich nur sagen, dass es wohl noch Leute gibt, die JS deaktiviert haben(dürften nicht mehr als 1% aller User sein), dass ich aber nicht bei meinen ersten Web-Versuchen darauf Obacht geben würde.

  • Variable bzw Link mehrfach

    Da gibt es immer die Frage, wie Dynamisch das ganze sein soll.

    Das kommt dann meistens darauf an, wieviele Links es gibt und ob diese dynamisch erweitert werden sollen.


    Aber wenn es so sein soll, wie du es in deinem ersten Post gezeigt hast, würde ich das so in etwa umsetzen:

    JavaScript
    const linkBase1 = 'https://www.facebook.com/groups/1738406594456911/';
const linkBase2 = 'https://www.facebook.com/groups/1738406273456775/';

// Du musst noch Selektoren in dein HTML einfügen.
// Ich habe hier mal für mein Beispiel Attribut-Selektoren verwendet damit es funktioniert.
document.querySelector('dt a[href$="StartBild-01.gif"]').href = baseLink1 + 'StartBild-01.gif'
document.querySelector('dt img[href$="StartBild-01.gif"]').src = baseLink2 + 'StartBild-01.gif'
...

    Diese Lösung ist zwar wenig dynamisch, aber ich denke, sie kommt dem was du vorhast am nächsten.

  • Variable bzw Link mehrfach

    Hallo AlpenZwerg,


    Wenn der Code in deiner HTML Datei steht

    vermischst du gerade JavaScript mit HTML.
    var ist ein JavaScript Schlüsselwort und hat in HTML nichts zu suchen.


    Das was du vorhast, kannst du entweder auf dem Client mit JavaScript machen, oder auf dem Server mit PHP.

    in HTML geht das nicht.



    Tip:

    Achte mal auf Groß und Kleinschreibung und schreibe alle HTML Tags klein.

    Außerdem nimm bitte statt border="" einen style (am besten mit Hilfe einer css Klasse)

  • zwei conditions

    Hallo VFB,


    Es kommt immer darauf an, wie dynamisch du das haben möchtest.

    Die Lösungsansätze von Sempervivum sehen gut aus.


    Nur ich würde eher data-attribute als IDs für die Gruppenzuordnungen verwenden.

    Dann wird die ID nicht blockiert.

    HTML
    <img data-group="g1" ... />
<p data-group="g1" ... />


    Was hast du denn vor?

    Vielleicht kann man das auch noch anders Umgesetzen?