ilch Forum » Allgemein » HTML, PHP, SQL,... » Laufschrift & Avatar Auswahl

Geschlossen
  1. #1
    User Pic
    M.vittel Mitglied
    Registriert seit
    16.11.2018
    Beiträge
    328
    Beitragswertungen
    24 Beitragspunkte
    Ich hätte gerne 2 Erweiterungen für die Page, weis aber nicht wie ich die machen kann / muss.
    Habe bereits die alten addons durchsucht aber nichts gefunden was in der neuen 2.1 Version eingebunden werden kann.

    1.) Es gibt zwischen den Slider und das Nächste Fenster einen freien platz da zwischen würde ich gerne eine Laufschrift haben. Als Beispiel, Wir suchen Spieler ab...

    2.) Das kenne ich vom zdcp, es gab ein addon so das man sich sein Avatar aus eine Liste wählen kann. Gibt es sowas auch hier? Wenn nein, wer kann mir helfen sowas zu erstellen? Die Avatare haben eine Größe von 131 x 131 als jpg

    Ich sage schon mal danke, sollte dieser tread im falschen bereich sein dann bitte verschieben.

    Beachtet auch meinen anderen tread: externer Link


    verwendete ilch Version: 2.1.x

    betroffene Homepage: gdz.bplaced.net


    Zuletzt modifiziert von M.vittel am 26.11.2018 - 20:40:24
    RealLife ... das ist doch das Game mit der geilen Grafik und der scheiss Story
    0 Mitglieder finden den Beitrag gut.
  2. #2
    User Pic
    Nex4T Moderator
    Registriert seit
    28.02.2007
    Beiträge
    3.414
    Beitragswertungen
    213 Beitragspunkte
    ZitatZitat geschrieben von M.vittel

    1.) Es gibt zwischen den Slider und das Nächste Fenster einen freien platz da zwischen würde ich gerne eine Laufschrift haben. Als Beispiel, Wir suchen Spieler ab...


    Schau mal Hier : codepen.io/jamesbarnett/pen/kfmKa
    ist ganz Leicht einzubinden mit HTMl & CSS

    ZitatZitat geschrieben von M.vittel

    2.) Das kenne ich vom zdcp, es gab ein addon so das man sich sein Avatar aus eine Liste wählen kann. Gibt es sowas auch hier? Wenn nein, wer kann mir helfen sowas zu erstellen? Die Avatare haben eine Größe von 131 x 131 als jpg


    So ein Addon gibt es aktuell nicht, wird bestimmt aber mal kommen zwinker
    while(!asleep()) sheep++;
    www.movely.biz
    www.webplant.eu
    0 Mitglieder finden den Beitrag gut.
  3. #3
    User Pic
    M.vittel Mitglied
    Registriert seit
    16.11.2018
    Beiträge
    328
    Beitragswertungen
    24 Beitragspunkte
    ZitatZitat
    Schau mal Hier : codepen.io/jamesbarnett/pen/kfmKa
    ist ganz Leicht einzubinden mit HTMl & CSS


    Kann mir wer sagen wo ich die HTML datei finde und welche CSS ich nutzen muss?
    RealLife ... das ist doch das Game mit der geilen Grafik und der scheiss Story
    0 Mitglieder finden den Beitrag gut.
  4. #4
    User Pic
    Slipi ilch.de Design
    Registriert seit
    19.01.2018
    Beiträge
    938
    Beitragswertungen
    117 Beitragspunkte
    ZitatZitat geschrieben von M.vittel
    ZitatZitat
    Schau mal Hier : codepen.io/jamesbarnett/pen/kfmKa
    ist ganz Leicht einzubinden mit HTMl & CSS


    Kann mir wer sagen wo ich die HTML datei finde und welche CSS ich nutzen muss?


    Einfach die Codes Kopieren, füge sie in deinen Editor und bearbeite sie nach deinen wünschen.
    Sollte es Probleme geben mit der Umsetzung, einfach weider Probieren. Sollte aber der Wurm vergraben sein, dann einfach melden, und dir wieder sicher geholfen.

    Slipi


    Zuletzt modifiziert von Slipi am 28.11.2018 - 22:03:22
    0 Mitglieder finden den Beitrag gut.
  5. #5
    User Pic
    M.vittel Mitglied
    Registriert seit
    16.11.2018
    Beiträge
    328
    Beitragswertungen
    24 Beitragspunkte
    Wir haben mal einen Test gemacht um mit den vorgegebenen Tools welche Ilch zur Verfügung stellt.
    Menü 3 erstellt, die Laufschrift soll als "Laufschrift_Box" angezeigt werden. Es wird aber nicht angezeigt.
    Im Layout habe ich was von "hidden" gelesen. Da die Layouts aber immer geupdated werden, würde ich das ungern rausnehmen.
    Kann man Evtl. das hidden in der css rausnehmen? Was hängt da sonst noch mit dran?
    RealLife ... das ist doch das Game mit der geilen Grafik und der scheiss Story
    0 Mitglieder finden den Beitrag gut.
  6. #6
    User Pic
    M.vittel Mitglied
    Registriert seit
    16.11.2018
    Beiträge
    328
    Beitragswertungen
    24 Beitragspunkte
    Leider bekomme ich es nicht wirklich hin, dass ich eine Laufschrift mit Hilfe von CSS & Java genau zwischen den Header und den container, genau in der schwarzen Zeile angezeigt bekomme.
    Wenn ich nur den Bereich welches in HTML steht nehme wird es Richtig angezeigt aber nur auf den PC.
    <div class="marquee"><span style='position:absolute; top: 416px; left: 195px; color: #FFFFFF; font-size: 17px; width: 1600px; font-familiy: Arial; font-weight: normal'>
    <marquee direction=left scrollamount=10 scrolldelay=8 bgcolor=#000000 height=17 >Info:&nbsp;</span></strong></span><em><a href="https://gdz.bplaced.net/index.php/forum/showposts/index/topicid/21"><span style="color:#ffffff;"><strong><span style="font-size:16px;">im Forum die Aufgaben zum Forge Bowl Event 2019</span></strong></span></a></em></div>

    .marquee {
      width: 1600px;
      overflow: hidden;
      border: 1px solid #ccc;
      background: #ccc;
      top: 416px; 
      left: 195px;
      color: #FFFFFF; 
      font-size: 17px; 
      font-familiy: Arial; 
      font-weight: normal;
      marquee direction=right scrollamount=10 scrolldelay=8;
    }

    $('.marquee').marquee();

    Könnte bitte wer von euch sich das mal anschauen und die 3 teile korrigieren?
    Eine index.js ist bereits angelegt.
    Vielen Dank.
    RealLife ... das ist doch das Game mit der geilen Grafik und der scheiss Story
    0 Mitglieder finden den Beitrag gut.
  7. #7
    User Pic
    Nex4T Moderator
    Registriert seit
    28.02.2007
    Beiträge
    3.414
    Beitragswertungen
    213 Beitragspunkte
    Wieso hast du es den nicht nach meinem Beispiel gemacht, wäre doch die sinnvollere variante gewesen^^
    while(!asleep()) sheep++;
    www.movely.biz
    www.webplant.eu
    0 Mitglieder finden den Beitrag gut.
  8. #8
    User Pic
    M.vittel Mitglied
    Registriert seit
    16.11.2018
    Beiträge
    328
    Beitragswertungen
    24 Beitragspunkte
    Habe ich probiert, hat nicht geklappt wie ich es mir dachte :-(
    RealLife ... das ist doch das Game mit der geilen Grafik und der scheiss Story
    0 Mitglieder finden den Beitrag gut.
  9. #9
    User Pic
    Slipi ilch.de Design
    Registriert seit
    19.01.2018
    Beiträge
    938
    Beitragswertungen
    117 Beitragspunkte
    Was genau sollte angezeigt werden in der marquee? Bzw wie sollte es nach deinen Vorstellungen aussehen.

    Werde heute nach der Schicht was schreiben.

    Slipi

    Ps: Nex4T sein Vorschlag gefällt mir


    Zuletzt modifiziert von Slipi am 27.01.2019 - 22:54:55
    0 Mitglieder finden den Beitrag gut.
  10. #10
    User Pic
    Slipi ilch.de Design
    Registriert seit
    19.01.2018
    Beiträge
    938
    Beitragswertungen
    117 Beitragspunkte
    Hab mal was gebastelt

    In der index.php zwischen <header> und <div class="Container"... füge diesen Code ein

    <div class="container" id="laufschrift">
     <div class="row">
      <div class="marquee">
      <div>
        <span>You spin me right round, baby. Like a record, baby.</span>
        <span>You spin me right round, baby. Like a record, baby.</span>
      </div>
      </div>
     </div>
    </div>


    Das war der erste Schritt.

    Jetzt müssen wir die style.css bearbeiten. Als erstes füge dies ein

    @-webkit-@keyframes marquee {
     100%   { text-indent: -100% }
     0% { text-indent: 100% }
    }
    
    @keyframes marquee {
     100%   { text-indent: -100% }
     0% { text-indent: 100% }
    }
    
    .marquee {
     width: 100%;
     margin: auto;
     padding: 2px;
     overflow: hidden;
     white-space: nowrap;
    /*--Hier kannst du die Dauer der schleife einstellen--*/
     animation: marquee 25s linear infinite;
     color:#fff;
    }
    .marquee span {
    /*--die breite anpassen, bei 2 Elemente in der HTML 50%, bei 3 33.3% usw--*/
    	width:50%;
    	float:left;
    }


    Um die Animation zu stoppen füge dies ein

    .marquee:hover {
     animation-play-state: paused;
        -webkit-animation-play-state: paused;
    }


    Damit das ganze auch stimmig ist (Layout) kannst die class Gaming bearbeiten, der header und der main bereich zur laufschrift aufschließen.

    SLipi

    .gaming {margin:0}
    #laufschrift .row {margin:0;}


    Hoffe das du so etwas suchst.

    Slipi


    Zuletzt modifiziert von Slipi am 28.01.2019 - 01:43:11
    0 Mitglieder finden den Beitrag gut.
  11. #11
    User Pic
    Nex4T Moderator
    Registriert seit
    28.02.2007
    Beiträge
    3.414
    Beitragswertungen
    213 Beitragspunkte
    Richtig genau wie in meinem Beispiel, ganz normaler marquee effekt
    while(!asleep()) sheep++;
    www.movely.biz
    www.webplant.eu
    0 Mitglieder finden den Beitrag gut.
  12. #12
    User Pic
    Slipi ilch.de Design
    Registriert seit
    19.01.2018
    Beiträge
    938
    Beitragswertungen
    117 Beitragspunkte
    ZitatZitat geschrieben von Nex4T
    Richtig genau wie in meinem Beispiel, ganz normaler marquee effekt


    Richtig. Hab noch das stoppen hinzugefühgt.
    0 Mitglieder finden den Beitrag gut.
  13. #13
    User Pic
    M.vittel Mitglied
    Registriert seit
    16.11.2018
    Beiträge
    328
    Beitragswertungen
    24 Beitragspunkte
    Danke, werde es die Tage mal versuchen einzubauen, ich hoffe es klappt dann :-)


    Zuletzt modifiziert von M.vittel am 28.01.2019 - 20:31:40
    RealLife ... das ist doch das Game mit der geilen Grafik und der scheiss Story
    0 Mitglieder finden den Beitrag gut.
  14. #14
    User Pic
    M.vittel Mitglied
    Registriert seit
    16.11.2018
    Beiträge
    328
    Beitragswertungen
    24 Beitragspunkte
    Kann geschlossen werden.

    Vielen dank für die Super Unterstützung :-)


    Zuletzt modifiziert von M.vittel am 26.02.2019 - 12:12:14
    RealLife ... das ist doch das Game mit der geilen Grafik und der scheiss Story
    0 Mitglieder finden den Beitrag gut.
Geschlossen

Zurück zu HTML, PHP, SQL,...

Optionen: Bei einer Antwort zu diesem Thema eine eMail erhalten