Cikkajánló
Ez a cikk kérésre született meg, de valószínű előbb-utóbb magam is írtam volna róla, mert sajnos nagyon sok olyan szerkesztő van, aki valamilyen módon, de nagyon irritáló tud lenni.
Már többször kérdeztétek tőlem, hogy meglehet-e azt csinálni, amikor átlátszó modult használtok, hogy csak a modul legyen átlátszó, de a benne lévő tartalom vagy kép az ne. A válasz
Sikerült megint egy prémium témát készítenem WordPress-hez. Valami kéket szerettem volna és azt hiszem sikerült is egy szép kék színt választanom hozzá. Nagyon szeretem Gigi-nek ezt a fotósorozatát, így
Szövegdoboz | Kattintásra kijelöli és másolja a szöveget Ingyenes téma | Coppermine Gallery free theme Prémium téma | Sophie Turner WordPress theme WordPress | Letöltés számláló Apró tippek weboldal szerkesztőknek
Képváltó kód 01.


Javascript kód
A .js fájlokat töltsétek le, majd töltsétek fel a tárhelyetekre, az URL címét pedig cseréljétek le a kódban. Kiemeltem az URL részt a Javascript kódban.
G-Portálosoknak: A .js fájlokat oldaladon a Médiatárba töltsd fel!
kepvalto-fejlec-script-01.js, kepvalto-fejlec-script-01-01.js
 

<script src="/js/kepvalto-fejlec-script-01.js"></script>
<script src="/js/kepvalto-fejlec-script-01-01.js"></script>


Képváltó kódja
Akkor lesz szép a script, ha minden képed egyforma nagyságú!!!
 

<div id="slideshow">
 <img alt="" class="active" src="/images/scripts/kepvalto-fejlec/01/001.png" />
<img alt="" src="/images/scripts/kepvalto-fejlec/01/002.png" />
<img alt="" src="/images/scripts/kepvalto-fejlec/01/003.png" />
<img alt="" src="/images/scripts/kepvalto-fejlec/01/004.png" />
</div>


CSS kód
 

<style type="text/css">
#slideshow {
    position:relative;
    height:500px; /* képeid magassága */
}
#slideshow IMG {
    position:absolute;
    top:0; /* mennyi pixellel legyen lejjebb a kép a lap tetejétől */
    left:100; /* a lap bal oldalához képest mennyivel legyen jobbra a kép */
    z-index:8;
    opacity:0.0;
}
#slideshow IMG.active {
    z-index:10;
    opacity:1.0;
}
#slideshow IMG.last-active {
    z-index:9;
}</style>

lindadesign Hozzászólások
2 172 megtekintés

Hozzászólások