Hjælp til CSS

<ole>

Det kan du ikke ændre med CSS. Du skal bruge JavaScript - og det er ret bøvlet, da der er tale om en del baggrundsbilleder. Spørgsmålet er, om du overhovedet må pille i udseendet. Hvor har du linket fra til js-filen?

/mvh
</bole>

Linket er hentet på Ekstrabladet.dk under løbesedler.
Troede bare at man f.ekt ved at hente filen ind i et iframe kunne bestemme CSS der.

Hvor finder jeg 'løbesedler' på ekstrabladet.dk?

Det hjælper ikke noget at lægge scriptet i en iframe

Den jeg bruger på hjemmesiden finder du her:
http://ekstrabladet.dk/rss2/?mode=normal

Nederst på denne side:
http://ekstrabladet.dk/om_ekstra_bladet/article203199.ece

Tja ... tjohh ... hmmm, de skriver vist ikke noget om, du ikke må ændre udseende - men det må du helt selv tage ansvar for!

Dette er, hvad scriptet spytter ud:

<style>
    #plus{font: normal 10px Verdana, Helvetica, Arial, Geneva;padding-top: 2px;padding-bottom: 3px;padding-left: 13px;color: #000066;}
    #ticker{font: normal 10px Verdana, Helvetica, Arial, Geneva;padding-top: 2px;padding-bottom: 3px;color: #727272;}
    a.ticker{ color: #000066; text-decoration: none;}
    a.ticker:link{ color: #000066; text-decoration: none;}
    a.ticker:active {color: #3366FF; text-decpration: none;}
    a.ticker:visited {color: #660000; text-decoration: none;}
    a.ticker:hover {color: #3366FF; text-decoration: none;}
</style>

<table width="152" cellpadding="0" cellspacing="0" border="0" background="http://img.ekstrabladet.dk/ticker/ticker_bg.gif">
    <tr><td colspan="3"><img src="http://img.ekstrabladet.dk/ticker/ticker_top.gif" border="0" width="152" height="54"><br></td></tr>
    <tr><td align="left" valign="top" id="plus" width="12">&gt;&nbsp;</td><td align="left" valign="top" id="ticker" width="143">15:58 <a href="http://ekstrabladet.dk/sport/dansk_fodbold/fc_midtjylland/article998031.ece" class="ticker" target="_blank">Følg Superligaen live</a></td><td align="left" valign="top" class="ticker" width="5">&nbsp;</td></tr>
    <tr><td colspan="3"><img src="http://img.ekstrabladet.dk/ticker/ticker_streck.gif" border="0" width="152" height="7"><br></td></tr>
    <tr><td align="left" valign="top" id="plus" width="12">&gt;&nbsp;</td><td align="left" valign="top" id="ticker" width="143">15:52 <a href="http://ekstrabladet.dk/sport/dansk_fodbold/agf/article997945.ece" class="ticker" target="_blank">AGF på overlevelseskurs</a></td><td align="left" valign="top" class="ticker" width="5">&nbsp;</td></tr>
    <tr><td colspan="3"><img src="http://img.ekstrabladet.dk/ticker/ticker_streck.gif" border="0" width="152" height="7"><br></td></tr>
    <tr><td align="left" valign="top" id="plus" width="12">&gt;&nbsp;</td><td align="left" valign="top" id="ticker" width="143">15:28 <a href="http://ekstrabladet.dk/sport/anden_sport/motorsport/article998026.ece" class="ticker" target="_blank">Tom K. i ny DTM-ulykke</a></td><td align="left" valign="top" class="ticker" width="5">&nbsp;</td></tr>
    <tr><td colspan="3"><img src="http://img.ekstrabladet.dk/ticker/ticker_streck.gif" border="0" width="152" height="7"><br></td></tr>
    <tr><td align="left" valign="top" id="plus" width="12">&gt;&nbsp;</td><td align="left" valign="top" id="ticker" width="143">15:01 <a href="http://ekstrabladet.dk/112/article998001.ece" class="ticker" target="_blank">Fængslet for overfald på Tvind-skole</a></td><td align="left" valign="top" class="ticker" width="5">&nbsp;</td></tr>
    <tr><td colspan="3"><img src="http://img.ekstrabladet.dk/ticker/ticker_streck.gif" border="0" width="152" height="7"><br></td></tr>
    <tr><td align="left" valign="top" id="plus" width="12">&gt;&nbsp;</td><td align="left" valign="top" id="ticker" width="143">14:55 <a href="http://ekstrabladet.dk/sport/udenlandsk_fodbold/engelsk_fodbold/article997995.ece" class="ticker" target="_blank">Storsejr giver Villa håb om Europa</a></td><td align="left" valign="top" class="ticker" width="5">&nbsp;</td></tr>
    <tr><td colspan="3"><img src="http://img.ekstrabladet.dk/ticker/ticker_streck.gif" border="0" width="152" height="7"><br></td></tr>
    <tr><td align="left" valign="top" id="plus" width="12">&gt;&nbsp;</td><td align="left" valign="top" id="ticker" width="143">14:54 <a href="http://ekstrabladet.dk/sport/anden_sport/motorsport/article997850.ece" class="ticker" target="_blank">Vred Mosley forsvarer sig</a></td><td align="left" valign="top" class="ticker" width="5">&nbsp;</td></tr>
    <tr><td colspan="3"><img src="http://img.ekstrabladet.dk/ticker/ticker_streck.gif" border="0" width="152" height="7"><br></td></tr>
    <tr><td align="left" valign="top" id="plus" width="12">&gt;&nbsp;</td><td align="left" valign="top" id="ticker" width="143">14:52 <a href="http://ekstrabladet.dk/sport/anden_sport/anden_sport/article997988.ece" class="ticker" target="_blank">Tine smed EM-guldet</a></td><td align="left" valign="top" class="ticker" width="5">&nbsp;</td></tr>
    <tr><td colspan="3"><img src="http://img.ekstrabladet.dk/ticker/ticker_streck.gif" border="0" width="152" height="7"><br></td></tr>
    <tr><td align="left" valign="top" id="plus" width="12">&gt;&nbsp;</td><td align="left" valign="top" id="ticker" width="143">14:40 <a href="http://ekstrabladet.dk/nyheder/samfund/article997973.ece" class="ticker" target="_blank">Mirakelbaby overlever deformitet</a></td><td align="left" valign="top" class="ticker" width="5">&nbsp;</td></tr>
    <tr><td colspan="3"><img src="http://img.ekstrabladet.dk/ticker/ticker_streck.gif" border="0" width="152" height="7"><br></td></tr>
    <tr><td align="left" valign="top" id="plus" width="12">&gt;&nbsp;</td><td align="left" valign="top" id="ticker" width="143">14:31 <a href="http://ekstrabladet.dk/112/article997970.ece" class="ticker" target="_blank">Finnerne beder for busulykkes ofre</a></td><td align="left" valign="top" class="ticker" width="5">&nbsp;</td></tr>
    <tr><td colspan="3"><img src="http://img.ekstrabladet.dk/ticker/ticker_streck.gif" border="0" width="152" height="7"><br></td></tr>
    <tr><td align="left" valign="top" id="plus" width="12">&gt;&nbsp;</td><td align="left" valign="top" id="ticker" width="143">14:03 <a href="http://ekstrabladet.dk/sport/haandbold/article997943.ece" class="ticker" target="_blank">Stærk Ikast-indsats i EC-drama</a></td><td align="left" valign="top" class="ticker" width="5">&nbsp;</td></tr>
    <tr><td colspan="3"><img src="http://img.ekstrabladet.dk/ticker/ticker_streck.gif" border="0" width="152" height="7"><br></td></tr>
    <tr><td colspan="3"><img src="http://img.ekstrabladet.dk/ticker/ticker_bottom.gif" border="0" width="152" height="30"><br></td></tr>
</table>

Hvis du lægger EB's script i et et div, så kan du under div'et lægge et nyt script-tag, hvor du bladrer tabellens rækker igennem. Det array får du fat i med:
    var oTable = document.getElementById("ebScriptDivID").getElementsByTagName("table")[0];
    var aRows = oTable.getElementsByTagName("tr");

Kør en løkke over aRows. I hver række kan du så hive fat i de forskellige elementer med f.eks:
    aRows[i].getElementByTagName("img")[0] // Et billede (det første i rækken)

Når du har fat i et element, ændrer du dets styles og/eller sætter ny src

- sorry ... glemte et 's':
    aRows[i].getElementsByTagName("img")[0] // Et billede (det første i rækken)

Det var ellers ikke så lidt avanceret.:(

- that's life  =)

Det behøver ikke være så svært  :)

<div id="ebTicker">
<script type="text/JavaScript" src="http://ekstrabladet.dk/ticker/ticker.js"></script>
</div>

<script type="text/JavaScript">
var oTable = document.getElementById("ebTicker").getElementsByTagName("table")[0];
var aRows = oTable.getElementsByTagName("tr");
/*
HEAD_IMG -> 152 x 54 pixels
FOOT_IMG -> 152 x 30 pixels
SPACER_IMG -> 152 x 7 pixels
*/
var HEAD_IMG = "top.gif", FOOT_IMG = "bottom.gif",
SPACER_IMG = "spacer.gif", oImg = null;

// Nulstil tabellens baggrund:
oTable.setAttribute("background", "");
// Sæt evt. styles på tabellen:
oTable.style.backgroundImage = "url(http://www.eksperten.dk/img/elogo.png)";

for (var i=aRows.length-1; i>=0; i--) {
    if (i==aRows.length-1) { // Sidste række
        oImg = aRows[i].firstChild.firstChild;
        oImg.setAttribute("src", FOOT_IMG);
    }
    else if (i==0) { // Første række
        oImg = aRows[i].firstChild.firstChild;
        oImg.setAttribute("src", HEAD_IMG);
    }
    else if (i%2==0) { // En spacer-række
        oImg = aRows[i].firstChild.firstChild;
        oImg.setAttribute("src", SPACER_IMG);
    }
}
</script>

Njaahh ... du skal nok sikre dig mod, at scriptet fra EB ikke loader:

<script type="text/JavaScript">
var aTables = document.getElementById("ebTicker").getElementsByTagName("table");
if (aTables.length>0) {
    var oTable = aTables[0];
    var aRows = oTable.getElementsByTagName("tr");
    /*
    HEAD_IMG -> 152 x 54 pixels
    FOOT_IMG -> 152 x 30 pixels
    SPACER_IMG -> 152 x 7 pixels
    */
    var HEAD_IMG = "top.gif", FOOT_IMG = "bottom.gif",
    SPACER_IMG = "spacer.gif", oImg = null;

    // Nulstil tabellens baggrund:
    oTable.setAttribute("background", "");
    // Sæt evt. styles på tabellen:
    oTable.style.backgroundImage = "url(http://www.eksperten.dk/img/elogo.png)";

    for (var i=aRows.length-1; i>=0; i--) {
        if (i==aRows.length-1) { // Sidste række
            oImg = aRows[i].firstChild.firstChild;
            oImg.setAttribute("src", FOOT_IMG);
        }
        else if (i==0) { // Første række
            oImg = aRows[i].firstChild.firstChild;
            oImg.setAttribute("src", HEAD_IMG);
        }
        else if (i%2==0) { // En spacer-række
            oImg = aRows[i].firstChild.firstChild;
            oImg.setAttribute("src", SPACER_IMG);
        }
    }
}
</script>

- og skal man være lidt pedantisk (og sådan en chance skal man jo ikke lade fise forbi!), kan man pakke alle variablerne ind, så de ikke ligger og sejler i det globale scope:

<script type="text/JavaScript">
(function(){
    var aTables = document.getElementById("ebTicker").getElementsByTagName("table");
    if (aTables.length>0) {
        var oTable = aTables[0];
        var aRows = oTable.getElementsByTagName("tr");
        /*
        HEAD_IMG -> 152 x 54 pixels
        FOOT_IMG -> 152 x 30 pixels
        SPACER_IMG -> 152 x 7 pixels
        */
        var HEAD_IMG = "top.gif", FOOT_IMG = "bottom.gif",
        SPACER_IMG = "spacer.gif", oImg = null;

        // Nulstil tabellens baggrund:
        oTable.setAttribute("background", "");
        // Sæt evt. styles på tabellen:
        oTable.style.backgroundImage = "url(http://www.eksperten.dk/img/elogo.png)";

        for (var i=aRows.length-1; i>=0; i--) {
            if (i==aRows.length-1) { // Sidste række
                oImg = aRows[i].firstChild.firstChild;
                oImg.setAttribute("src", FOOT_IMG);
            }
            else if (i==0) { // Første række
                oImg = aRows[i].firstChild.firstChild;
                oImg.setAttribute("src", HEAD_IMG);
            }
            else if (i%2==0) { // En spacer-række
                oImg = aRows[i].firstChild.firstChild;
                oImg.setAttribute("src", SPACER_IMG);
            }
        }
    }
})();
</script>

Tak Ole, det vil jeg lege lidt med..:-)

Men hvor skal scriptet så placeres i forhold til scriptlinket fra EB?

Det er vist i (20/04-2008 21:33:01)

Super. Mange tak:-)

Men synes ikke jeg kan ændre tekst farven

Nej så skal du ind i de ulige rækker:


        for (var i=aRows.length-1; i>=0; i--) {
            if (i==aRows.length-1) { // Sidste række
                oImg = aRows[i].firstChild.firstChild;
                oImg.setAttribute("src", FOOT_IMG);
            }
            else if (i==0) { // Første række
                oImg = aRows[i].firstChild.firstChild;
                oImg.setAttribute("src", HEAD_IMG);
            }
            else if (i%2==0) { // En spacer-række
                oImg = aRows[i].firstChild.firstChild;
                oImg.setAttribute("src", SPACER_IMG);
            }
            else {
              // Den første celle (den med pilen):
                aRows[i].firstChild.style.color = "red";
              // Den anden celle (den med linket):
                aRows[i].firstChild.nextSibling.style.color = "red";
              // Selve linket i anden celle:
                aRows[i].getElementsByTagName("a")[0].style.color = "red";
            }
        }

Perfekt Ole, nu kører det.:-))

lukker