tips & tricks


Calendario
febbraio 2024
lmmgvsd
2930311234
567891011
12131415161718
19202122232425
26272829123
45678910

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.066
  • Views Posts: 55.653
  • 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