Cikkajánló
Ahogy tegnap írtam ma meghoztam a régóta feltöltésre váró .png képeket.  :) Ezek az albumok frissültek vagy születtek meg ma:   Kelly Rowland // 25 darab Lana Parrilla //
Új szavazást készítettem, amit már ki is tettem az oldalsávba de itt ebben a modulban is lehet szavazni. Azért írok róla külön bejegyzést is, mert nagyon kíváncsi vagyok a
Hogy mi is ez? Ez egy olyan kicsi button, amit csak a WordPress-be való bejelentkezés után lát a szerkesztő. Minden bejegyzésbe és oldalakba be lehet tenni, ami arra jó,
Sosugary Gallery | Jennifer Lawrence téma 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ó
Képváltó kód 03.

 

 

Javascript kódok
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-03.js, kepvalto-fejlec-script-03-01.js, kepvalto-fejlec-script-03-02.js
Akkor lesz szép a script, ha minden képed egyforma nagyságú!!!
Itt a javascript kódban azt emeltem ki, hogy hol kell kicserélned a képedre az enyémet. Az az, hova illeszd be a saját képed url címét.
 

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


Képváltó kódja
 

<div id="wrapper">
    <div id="slider-wrapper">
        <div class="nivoSlider" id="slider">
<img src="/images/scripts/kepvalto-fejlec/03/001.jpg" />
<img src="/images/scripts/kepvalto-fejlec/03/002.jpg" />
<img src="/images/scripts/kepvalto-fejlec/03/003.jpg" />
<img src="/images/scripts/kepvalto-fejlec/03/004.jpg" />
<img src="/images/scripts/kepvalto-fejlec/03/005.jpg" />
        </div>
    </div>


CSS kód
A nyilakat és a pöttyöket is mentsd le, majd töltsd fel a tárhelyedre és a CSS kódban cseréld le az URL címeket.
 

                 

 

<style type="text/css">
.nivoSlider {
    position:relative;
}
.nivoSlider img {
    position:absolute;
}
.nivoSlider a.nivo-imageLink {
    position:absolute;
    width:100%;
    height:100%;
    z-index:6;
    display:none;
}
.nivo-slice {
    display:block;
    position:absolute;
    z-index:5;
    height:100%;
}
.nivo-box {
    display:block;
    position:absolute;
    z-index:5;
}
.nivo-caption {
    position:absolute;
    background:#000;
    color:#fff;
    opacity:0.8;
    width:100%;
    z-index:8;
}
.nivo-caption p {
    padding:5px;
}
.nivo-caption a {
    display:inline !important;
}
.nivo-html-caption {
    display:none;
}
.nivo-directionNav a {
    position:absolute;
    top:45%;
    z-index:9;
    cursor:pointer;
}
.nivo-prevNav {
    left:0px;
}
.nivo-nextNav {
    right:0px;
}
.nivo-controlNav a {
    position:relative;
    z-index:9;
    cursor:pointer;
}
#slider-wrapper {
    background:no-repeat;
    width:400px; /* a képed szélessége */
    height:270px; /* a képed magassága */
}
#slider {
    position:relative;
    width:400px; /* a képed szélessége */
    height:270px; /* a képed magassága */
    background:url(/images/scripts/kepvalto-fejlec/03/001.gif) no-repeat 50% 50%;
}
#slider img {
    position:absolute;
    display:none;
}
#slider a {
    display:block;
}
.nivo-controlNav {
    position:absolute;
    left:135px; /* ennyivel vannak balra dobva a kép alatti karikák */
    bottom:-35px; /* ennyivel vannak le dobva a kép alatti karikák */
}
.nivo-controlNav a {
    display:block;
    width:22px;
    height:22px;
    background:url(/images/scripts/kepvalto-fejlec/03/002.png) no-repeat;
    text-indent:-9999px;
    margin-right:3px;
    float:left;
}
.nivo-controlNav a.active {
    background-position:0 -22px;
}
.nivo-directionNav a {
    display:block;
    width:30px;
    height:30px;
    background:url(/images/scripts/kepvalto-fejlec/03/003.png) no-repeat;
    text-indent:-9999px;
}
a.nivo-nextNav {
    background-position:-30px 0;
    right:15px;
}
a.nivo-prevNav {
    left:15px;
}
.nivo-caption {
    text-shadow:none;
    font-family: Helvetica, Arial, sans-serif;
}
.nivo-caption a {
    color:#efe9d1;
    text-decoration:underline;
}    </style>
</div>

lindadesign Hozzászólások
1 482 megtekintés

Hozzászólások