eGospodarka.pl
eGospodarka.pl poleca

eGospodarka.plGrupypl.comp.wwwzmiana wygladu DIV poprzez link › Re: zmiana wygladu DIV poprzez link
  • Path: news-archive.icm.edu.pl!news.rmf.pl!agh.edu.pl!news.agh.edu.pl!news.onet.pl!.PO
    STED!not-for-mail
    From: Andre <a...@a...pl>
    Newsgroups: pl.comp.www
    Subject: Re: zmiana wygladu DIV poprzez link
    Date: Sat, 12 Feb 2011 11:52:06 +0000 (UTC)
    Organization: http://onet.pl
    Lines: 147
    Message-ID: <ij5s96$15t$1@news.onet.pl>
    References: <ij468u$k7o$1@news.onet.pl> <20110211214517.4ca98d66@pingwin>
    <ij47tj$k7o$3@news.onet.pl> <20110211224939.15b5552e@pingwin>
    NNTP-Posting-Host: 77.236.10.230
    Mime-Version: 1.0
    Content-Type: text/plain; charset=UTF-8
    Content-Transfer-Encoding: 8bit
    X-Trace: news.onet.pl 1297511526 1213 77.236.10.230 (12 Feb 2011 11:52:06 GMT)
    X-Complaints-To: n...@o...pl
    NNTP-Posting-Date: Sat, 12 Feb 2011 11:52:06 +0000 (UTC)
    User-Agent: Pan/0.133 (House of Butterflies)
    Xref: news-archive.icm.edu.pl pl.comp.www:398232
    [ ukryj nagłówki ]

    Mirosław Zalewski napisał(a):

    > Znaczy:
    >
    > p {display: none;}
    > div1 a:hover p {display: block;}

    Dziala wysmienicie. Pod Firefoxem 3.6...
    A co zrobic, zeby to ruszylo pod IE8 (standard w Win7)?

    Pozwole sobie wkleic caly kod, ktorego uzywam:

    ----------html----------------------
    <div class="pad_rama">

    <a>

    <div class="pad_up">
    <p class="pad_header">Kasia</p>
    </div>

    </a>

    <div class="pad_mid">
    <p class="pad_opis">Absolwentka Turystyki i Rekreacji na krakowskim AWF-
    ie. Całe życie związana z ruchem narciarstwo, trekking górski, rolki,
    rower, salsa, taniec towarzyski, trenowała również karate kyokushin itp.
    </p>
    </div>

    <div class="pad_down">
    </div>
    ----------/html----------------------

    ----------css------------------------
    </div>



    body
    {
    background-color: black;
    }



    div.pad_rama {
    width: 500px;
    margin: 0 auto;
    padding: 0px;
    }


    div.pad_up {
    width: 100%;
    height: 20px;
    margin: 0px;
    padding: 0px;
    -moz-border-radius: 10px 10px 0px 0px;
    opacity: 0.5;
    background-color: red;
    display: block;
    }

    div.pad_mid {
    width: 100%;
    margin: 0px;
    padding: 0px;
    /*-moz-opacity: 0.5;*/
    background-color: green;
    }

    div.pad_down {
    width: 100%;
    height: 20px;
    margin: 0px;
    padding: 0px;
    -moz-border-radius: 0px 0px 10px 10px;
    /*-moz-opacity: 0.5;*/
    background-color: red;
    }



    p.pad_header {
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    display: block;
    overflow: hidden;
    font-family: Arial, Helvetica, sans-serif;
    font-style: normal;
    font-size: 16px;
    font-weight: bold;
    color: white;
    text-align: center;
    }


    p.pad_opis {
    margin: 0px 0px 0px 0px;
    padding: 5px;
    display: block;
    overflow: hidden;
    font-family: Arial, Helvetica, sans-serif;
    font-style: normal;
    font-size: 12px;
    font-weight: normal;
    color: white;
    text-align: left;
    display: none;
    }



    a:hover .pad_up {
    width: 100%;
    margin: 0px;
    padding: 0px;
    background-color: aqua;
    outline: none;
    -moz-border-radius: 10px 10px 0px 0px;
    /*opacity: 0.5;*/
    display: block;
    }


    a:hover + .pad_mid p.pad_opis {
    background-color: blue;
    display: block;
    color: red;
    display: block;
    }

    ----------/css------------------------


    Prosze nie zwracac uwagi na atrybuty tylko dla Mozilli. Rozszerzanie DIVa
    powinno dzialac niezaleznie. Border-radius to tylko dodatki kosmetyczne.
    Specjalnie zastosowalem rozne kolory, zeby bylo dokladnie widac, czy
    dziala.

    Z gory dziekuje za pomoc.


    --
    Pozdrawiam,
    Andre

Podziel się

Poleć ten post znajomemu poleć

Wydrukuj ten post drukuj


Następne wpisy z tego wątku

Najnowsze wątki z tej grupy


Najnowsze wątki

Szukaj w grupach

Eksperci egospodarka.pl

1 1 1

Wpisz nazwę miasta, dla którego chcesz znaleźć jednostkę ZUS.

Wzory dokumentów

Bezpłatne wzory dokumentów i formularzy.
Wyszukaj i pobierz za darmo: