tips & tricks


Calendario
maggio 2024
lmmgvsd
293012345
6789101112
13141516171819
20212223242526
272829303112
3456789

Outline Table Rows

Outline Table Rows

Una funzioncina utile per creare un effetto di evidenziatura di una riga quando vi passo su con il mouse in una tabella html.

Per funzionare bisogna inserire tra una riga e l'altra questo codice:


  <tr><td class="righeVuota" colspan="2" ></td></tr>


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

    <title>Untitled Page</title>

    <style type="text/css">

        .prova

        {

            background: #0099FF;

        }

        .righeVuota

        {

            height: 1px;

            line-height: 1px;

            max-height: 1px;

            padding: 0px;

        }

    </style>

 

    <script type="text/javascript">

 

    function Outline(currentTR,IO)

    {

        var righe = document.getElementsByTagName('tr');

 

        if(righe)

        {

            if (IO == "I")

            {

                righe[currentTR.rowIndex-1].style.backgroundColor= "#002e7a";

                righe[currentTR.rowIndex+1].style.backgroundColor= "#002e7a";

            }

        }

        else

        {

            righe[currentTR.rowIndex-1].style.backgroundColor= "#FFFFFF";

            righe[currentTR.rowIndex+1].style.backgroundColor= "#FFFFFF";

        }

    }

   

    </script>

 

</head>

<body>

    <table width="100%" border="0" cellpadding="10" cellspacing="0">

        <table width="100%" border="0" cellpadding="10" cellspacing="0">

            <tr>

                <td colspan="2" class="tab02_Int">

                    <h3>

                        Institutions</h3>

                </td>

            </tr>

            <tr>

                <td class="righeVuota" colspan="2">

                </td>

            </tr>

            <tr onmouseout="Outline(this,'O');" onfocus="Outline(this,'I');" onmouseover="Outline(this,'I');"

                onblur="Outline(this,'O');">

                <td class="tab03_Td0Top">

                    Confindustria

                </td>

                <td>

                    <a href="http://www.confindustria.it">http://www.confindustria.it</a>

                </td>

            </tr>

            <tr>

                <td class="righeVuota" colspan="2">

                </td>

            </tr>

            <tr onmouseout="Outline(this,'O');" onfocus="Outline(this,'I');" onmouseover="Outline(this,'I');"

                onblur="Outline(this,'O');">

                <td class="tab03_Td0Top">

                    Banca d'Italia

                </td>

                <td>

                    <a href="http://www.bancaditalia.it">http://www.bancaditalia.it</a>

                </td>

            </tr>

            <tr>

                <td class="righeVuota" colspan="2">

                </td>

            </tr>

            <tr onmouseout="Outline(this,'O');" onfocus="Outline(this,'I');" onmouseover="Outline(this,'I');"

                onblur="Outline(this,'O');">

                <td class="tab03_Td0Top">

                    Consob

                </td>

                <td>

                    <a href="http://www.consob.it">http://www.consob.it</a>

                </td>

            </tr>

            <tr>

                <td class="righeVuota" colspan="2">

                </td>

            </tr>

        </table>

</body>

</html>

 

 

Categoria: Jscript
venerdì, 07 ago 2009 Ore. 17.15
Archivio Posts
Anno 2020

Anno 2018

Anno 2015

Anno 2013

Anno 2011

Anno 2010

Anno 2009

Anno 2008
Statistiche
  • Views Home Page: 13.406
  • Views Posts: 56.214
  • Views Gallerie: 2.837
  • n° Posts: 117
  • n° Commenti: 1
Copyright © 2002-2007 - Blogs 2.0
dotNetHell.it | Home Page Blogs
ASP.NET 2.0 Windows 2003