Question

Can’t seem to get jquery.dropshadow.js to work on the proper selector. I’ve tried to select the id and I can’t get it to work. I’ve also tried the class (see below).

HEAD

<script src="scripts/jquery.dropshadow.js" type="text/javascript"></script>
<script type="text/javascript">
    window.onload = function () {
        $("#tacoFTB").dropShadow({ left: 8, top: 10, opacity: 0.8, blur: 4 });
    }
</script>

HTML

<form id="form1" runat="server">
<div class="backgroundBox">
    <table id="tacoBox" cellpadding="0" cellspacing="0" width="520" border="0">
        <tr>
            <td><img src="images/spacer.png" alt="" class="tacoTableColumnSpacer"/></td>
            <td class="tacoBoxMagicFTB" id="tacoFTB"><img src="images/spacer.png" alt="" height="55" width="1"/><img src="images/tb_feedthebeat.png" alt=""/><script type="text/javascript">getLikesFTB('113078108881');</script></td>
            <td><img src="images/spacer.png" alt="" class="tacoTableColumnSpacer"/></td>
        </tr>
    </table>

CSS

.tacoBoxMagicFTB
{
    background-color: White;
    border:1px solid #b695cb;
    width:100%;
    position: relative;
}

.tacoBoxMagicFTB img
{
    vertical-align: middle;
    padding-left: 10px;
}

Any help would be appreciated.

Answer 1

You don’t need jQuery to apply a shadow anymore, CSS handles it perfectly.

#tacoFTB
{
   -moz-box-shadow: 10px 10px 5px #888;
   -webkit-box-shadow: 10px 10px 5px #888;
   box-shadow: 10px 10px 5px #888;
}

Also, your table doesn’t appear to be displaying tabular data, are you using it as a layout tool?