tips & tricks


Calendario
febbraio 2025
lmmgvsd
272829303112
3456789
10111213141516
17181920212223
242526272812
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: 15.301
  • Views Posts: 58.620
  • 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