<script> Code anpassen bzw verändern ?

  • Hallo liebe Community,


    ich habe eine Frage und hoffe ich bin im richtigen Thread.


    Ich habe für einen Fussballverein vom Verband die Möglichkeit "Vereins-Widgets" für bspw. Tabelle, Spielplan, letztes Spiel, Nächstes Spiel etc auf meiner Website einzubinden.


    Nun bekomme ich dies (leider) als <script> Code (und nicht wie ich dachte vielleicht als iFrame o.ä.)


    Code
    1. <script id="fv-8b4714b734" wfd-id="240">
    2. (function(o,e,f,b,_,a,t){o[e]=o[e]||function(){(o[e].q=o[e].q||[])
    3. .push(arguments)};a=f.createElement(b);t=f.getElementsByTagName(b)
    4. [0];a.async=1;a.src=_;t.parentNode.insertBefore(a,t)})(window,'fv'
    5. ,document,'script','//vereine.oefb.at/widgets.js');
    6. fv('8b4714b734'); // NAECHSTES_SPIEL DESKTOP KM
    7. </script>


    Binde ich diesen ein, wird bspw. ein hässlicher border mit angezeigt und auch die Größe ist nicht so passend für meine Seite.

    Kann ich dies irgend wie anpassen?


    Habe in der .js nachgesehen, dort ist border eigentlich auf none gestellt (kann ich die js. einfach selber abspeichern bzw bearbeiten - auf meinem Server dann laden und Pfad entsprechend ändern) Habe im .js leider nicht so viel Erfahrung wie ich das machen kann

    Code
    1. frame.width = 1;
    2. frame.height = 1;
    3. frame.style.border = 'none';


    Vielen Dank für euren input !

  • Der iframe selber hat den Boder , den du mit css weg bekommst

    Code
    1. iframe{
    2. border:none;
    3. }

    Den Iframe selber könnte man nomalerweise auch mit Css ändern, was aber bei dir nicht geht , weil das Script die Werte setzt

    Code
    1. var style = "width:" + event.data.width + "px !important; ";
    2. style += "height:" + event.data.height + "px !important; ";
    3. style += "min-width:" + event.data.width+ "px !important; ";
    4. style += "min-height:" + event.data.height + "px !important; ";
    5. style += "max-width:" + event.data.width+ "px !important; ";
    6. style += "max-height:" + event.data.height + "px !important; ";

    Du könntest da da noch etwas äbändern , dann wäe der Iframe breiter.

    Den Inhalt vom Iframe kannst du selber nicht ändern oder Stylen.

  • Vielen Dank, dass mit dem border hat gut geklappt.


    Ich möchte insb. die Höhe des iFrame einstellen.

    Dafür müsste ich dann wie angedeutet di .js Datei entsprechend hier ändern (?):


    (wie kann ich das hier machen? wie gesagt mit js habe ich keine Erfahrung, oder könnte ich die width und height Angaben aus dem Script raus nehmen (ausklammern) und dann im css das iFrame entsprechend ändern könnte?


    Code
    1. var style = "width:" + event.data.width + "px !important; ";
    2. style += "height:" + event.data.height + "px !important; ";
    3. style += "min-width:" + event.data.width+ "px !important; ";
    4. style += "min-height:" + event.data.height + "px !important; ";
    5. style += "max-width:" + event.data.width+ "px !important; ";
    6. style += "max-height:" + event.data.height + "px !important; ";
  • Feste Werte kannst du da reinschreiben

    Code
    1. style += "height:auto !important; ";
    2. style += "min-height:500px !important; ";
    3. style += "max-height:100vh !important; ";

    Die größe mußt du selber testen, aber so sollte es funktionieren.

    Das !important könnte vieleicht auch weg , das mußt du dann einfach mal testen