Az oldal menüje
 
Az év weboldala - 2013


Photoshop leírások

Ikonbázis
Galéria
 

 
Címkék

A blogban leggyakrabban használt címkék

 

Neko

Szövegdobozok - Friss író dobozok
Szövegdobozok - Friss író dobozok : Egérre nyíló szövegdoboz

Egérre nyíló szövegdoboz


Demó
vidd az egeret az egyik szövegdoboz részhez (nem kell kattintani)
 

  • Szerkeszd meg a szövegdoboz tartalmát. Lehet egyből abban a modulban, ahova a doboz kódját másoltad, de elkészítheted külön egy új egyszerű modulban is, és aztán forráskódból kimásolod a megírt tartalmat és beilleszted itt a tartalom helye részhez. Ebbe a dobozba is bármi tehető. Kép, szöveg, menü, stb. Ezen a szövegdobozon nem szép, ha van oldalt görgetősáv, így ne lépje túl a tartalom a szövegdobozod magasságát. Ez csak egy javaslat természetesen. A javascript kódot úgy ahogy van másold be oldalad egyszerű moduljába. Ebben a kódban tudod a doboz magasságát állítani ennél a résznél: {peekw:'30px', fullw:'450px', h:'300px'}
    A h:300px jelöli a magasságot. Azt az egyet átírhatod.

Szerkeszd meg a szövegdoboz tartalmát. Lehet egyből abban a modulban, ahova a doboz kódját másoltad, de elkészítheted külön egy új egyszerű modulban is, és aztán forráskódból kimásolod a megírt tartalmat és beilleszted itt a tartalom helye részhez. Ebbe a dobozba is bármi tehető. Kép, szöveg, menü, stb. Ezen a szövegdobozon nem szép, ha van oldalt görgetősáv, így ne lépje túl a tartalom a szövegdobozod magasságát. Ez csak egy javaslat természetesen. A javascript kódot úgy ahogy van másold be oldalad egyszerű moduljába. Ebben a javascript kódban tudod a doboz magasságát állítani ennél a résznél: {peekw:'30px', fullw:'450px', h:'300px'}
A h:300px jelöli a magasságot. Azt az egyet átírhatod.

Javascript kód

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script><script type="text/javascript" src="//aranymeli.gportal.hu/portal/aranymeli/upload/285733_1415478401_01280.js">
</script><script type="text/javascript">
haccordion.setup({
    accordionid: 'hc2', //main accordion div id
    paneldimensions: {peekw:'30px', fullw:'450px', h:'300px'},
    selectedli: [-1, true], //[selectedli_index, persiststate_bool]
    collapsecurrent: true //<- No comma following very last setting!
})
</script>

Szövegdoboz kódja

<div class="haccordion" id="hc2">
    <ul>
        <li style="border-right-width:0">
            <div class="hpanel" style="padding:10px; width:400px">
<p>
                    Ide jön a tartalom</p>
            </div>
        </li>
        <li style="border-right-width:0">
            <div class="hpanel" style="padding:10px; width:400px">
<p>
                    Ide jön a tartalom</p>
            </div>
        </li>
        <li style="border-right-width:0">
            <div class="hpanel" style="padding: 10px; width: 400px; text-align: center;">
<p>
                    Ide jön a tartalom</p>

</div>
        </li>
        <li>
            <div class="hpanel" style="padding: 10px; width: 400px; text-align: center;">
<p>
                    Ide jön a tartalom</p>

</div>
        </li>
    </ul>
</div>

CSS kód

<style type="text/css">
#hc2 li{
   margin:0 0 0 0;
   border: 12px solid #CED495; /* doboz kerete */
}

#hc2 li .hpanel{ /* doboz tartalma */
   font-family: Arial, Sans sherif;
   font-size: 13px;
   color: #868651;
   padding: 5px;
   background: #1B1C16;
   text-align: justify;
}

/* innentől semmin sem kell állítani */

.haccordion{
   padding: 0;
}

.haccordion ul{
   margin: 0;
   padding: 0;
   list-style: none;
   overflow: hidden;
}


.haccordion li{
   margin: 0;
   padding: 0;
   display: block;
   width: 100%;
   overflow: hidden;
   float: left;
}

.haccordion li .hpanel{
   width: 100%;
}</style>
 

Forrás

Még nincs hozzászólás.
Csak regisztrált felhasználók írhatnak hozzászólást.
 

Mindig tudnod kell, melyik kikötõ felé tartasz. - ROSE HARBOR, a mi városunk - FRPG    *****    A boroszkányok gyorsan megtanulják... Minden mágia megköveteli a maga árát. De vajon mekkora lehet ez az ár? - FRPG    *****    Alkosd meg a saját karaktered, és irányítsd a sorsát! Vajon képes lenne túlélni egy ilyen titkokkal teli helyen? - FRPG    *****    why do all monsters come out at night - FRPG - Csatlakozz közénk! - Írj, és éld át a kalandokat!    *****    Aki szörnyekkel küzd, vigyázzon, nehogy belõle is szörny váljék. S ha hosszasan tekintesz egy örvénybe, az örvény vissza    *****    Rose Harbor, ahol a tenger suttog és a múlt sosem tûnik el teljesen. - FRPG - csatlakozz közénk te is :)    *****    Egy kikötõ, ahol minden hullám egy új kezdetet ígér. Rose Harbor, több mint egy város, egy világ a világ mögött.    *****    Rose Harbor &#8211; kisvárosi báj, nagy titkokkal - légy részese te is ennek a kalandnak :) - FRPG    *****    Óceán, erdõ, csillagfény &#8211; minden ösvény Rose Harborba vezet - aktív FRPG közösség    *****    Itachi Shinden 1. kötet Magyarul elérhetõ a konoha.hu -n. Nézzetek be! *** Itachi Shinden 1. kötet Magyarul elérhetõ!!!    *****    ÁGICAKÖNYVTÁRA - KÖNYVEK, KÖNYVEK, KÖNYVEK - ÁGICAKÖNYVTÁRA    *****    MOVIE-NIGHT -> Filmek, Sorozatok <- MOVIE-NIGHT    *****    Movie-    *****    Játssz a színekkel keress szebbnél szebb képeket, építs, szépítsd a portálod, hogy szebb és színesebb legyen a világod!    *****    Debrecen Huszti Lakóparki napelemes családiház eladó. 06209911123 Debrecen Huszti Lakóparki napelemes családiház eladó.    *****    Pont ITT Pont MOST! Pont NEKED! Már fejlesztés alatt is szebbnél színes szebb képek! Ha gondolod gyere less be!    *****    Kedves Csokoládé kedvelõk! Segítségeteket kérném a kérdõívem kitöltéséhez! Témája a CSOKOLÁDÉ MÁRKÁK! Köszön    *****    Homlokzati hõszigetelés! Vállaljuk családi házak, lakások, nyaralók és egyéb épületek homlokzati hõszigetelését!    *****    * Beugrós munkavállalók éjjel-nappal. * Beugrós munkavállalók éjjel-nappal. * Beugrós munkavállalók éjjel-nappal. *    *****    Elindult a Játék határok nélkül rajongói oldal! Ha te is szeretted a '90-es évek népszerû mûsorát, nézz be ide!