Avatar billede some-one Nybegynder
30. juni 2003 - 15:56 Der er 9 kommentarer og
1 løsning

Skygge på <table>

Hey. Jeg har lavet et design, hvori jeg bruger en bunke af CSS - deriblandt en dropshadow fra M$. Denne er bare ikke, med i standarderne for CSS (W3C). Nogen der kender noget som kan bruges? Så nemt som muligt selvf.
Avatar billede roenving Novice
30. juni 2003 - 15:58 #1
Måske sådan noget:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
    <title> TITLE </title>

<META NAME="Keywords" CONTENT="olebole,http://www.eksperten.dk/spm/342379">
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
.shadeHolder {
    position: relative;
}
.shadeTBL {
    position: relative;
    left: 0px;
    top: 0px;
    z-index: 5;
    background-color: #ffffff;
}
.shader {
    position: absolute;
    background-color: #000080;
}
</style>
<script type="text/JavaScript">
var startOpacity = 25; // Sæt selv start-opaciteten
var d=document;
function gA(o,tN){return o.getElementsByTagName(tN)}
function pI(s){return parseInt(s)}
function doShade(tbl) {
    var w, h, a, offset, opac, cont = (d.all)? tbl.parentElement : tbl.parentNode;
    w=pI(tbl.offsetWidth); h=pI(tbl.offsetHeight);
    a = new Array();
    var steps = (d.all && !window.createPopup)? 1 : 4; // Antal skygge-steps
    for (var i=1; i<steps+1; i++) {
        offset = i + "px";
        opac = startOpacity / i;
        a[a.length] = '<img class="shader" src="spacersort.gif" ';
        a[a.length] = 'style="width:'+w+'px;height:'+h+'px;left:'+offset+';top:'+offset+';z-index:'+i+';';
        if (d.all) a[a.length] = 'filter:alpha(opacity='+opac+')">';
        else a[a.length] = '-moz-opacity:'+(opac/100)+'">';
    }
    cont.innerHTML += a.join("");
}

function initShadeTBLs() {
    if (d.layers) return;
    var aTbl = gA(d,"TABLE");
    for (var i=0; i<aTbl.length; i++) {
        if ( aTbl[i].className=="shadeTBL" ) doShade( aTbl[i] );
    }
}
window.onload = initShadeTBLs;
</script>
</head>
<body>

<div class="shadeHolder">
    <table class="shadeTBL" cellspacing="0" cellpadding="0" border="3">
    <tr>
        <td>Lorem ipsum dolor sit amet, consectetur<br>
            adipisicing elit, sed do eiusmod tempor incididunt<br>
            ut labore et dolore magna aliqua.</td>
    </tr>
    </table>
</div>

<br><br>

<div class="shadeHolder">
    <table class="shadeTBL" cellspacing="0" cellpadding="0" border="3">
    <tr>
        <td>Ut enim ad minim veniam, quis nostrud<br>
            exercitation ullamco laboris nisi ut aliquip ex<br>
            ea commodo consequat. Duis aute irure dolor in<br>
            reprehenderit in voluptate velit esse cillum</td>
    </tr>
    </table>
</div>

</body>
</html>
Avatar billede some-one Nybegynder
30. juni 2003 - 16:06 #2
Noget i den stil. Har brugt
filter: progid:DXImageTransform.Microsoft.dropShadow( Color=99CCFF,offX=10,offY=10,positive=true);

Men den er W3C som allerede nævnt ikke glad for.
Er der et kortere alternativ? Som virker som scriptet ovenfor. (for at være lidt besværlig)
Avatar billede roenving Novice
30. juni 2003 - 16:09 #3
Kender ikke nogen andre veje ...

-- og forøvrigt er oleboles script jo genialt !o]
Avatar billede some-one Nybegynder
30. juni 2003 - 16:12 #4
Det kan det som det skal :o)
Jeg takker pænt :o)
Har søgt Google tynd - uden at finde noget jeg kunne bruge, så du har fortjent dem til fulde.
Avatar billede some-one Nybegynder
30. juni 2003 - 16:13 #5
Jeg kan ikke give points? Er ikke så meget inde i det. Prøv at skrive et svar - hjælper det?
Avatar billede roenving Novice
30. juni 2003 - 16:13 #6
Velbekomme '-)
Avatar billede some-one Nybegynder
30. juni 2003 - 16:40 #7
Takker :o))))
Du aner ikke hvor meget bøvl, du har stoppet.
Avatar billede roenving Novice
30. juni 2003 - 16:42 #8
-- takker for points ;~}
Avatar billede some-one Nybegynder
30. juni 2003 - 17:03 #9
Så lidt. Vender tilbage hvis der er probs.
Ok?
Avatar billede roenving Novice
30. juni 2003 - 17:04 #10
Du skal da være velkommen ...
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
Vi tilbyder markedets bedste kurser inden for webudvikling

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester