Cikkajánló
Most, hogy kicsit jobban rákattantam a Coppermine Galériára és annak trükkjeire, észrevettem, hogy nagyon-nagyon régen nem hoztam már .png képeket, bár készítgettem őket, csak nem lettek feltöltve, így most
Mindig is foglalkoztatott, hogy hogyan lehet egyszerűen azt látni, hogy egy adott fájlt mennyien töltöttek le. Gondolom nem meglepő, hogy erre is van WordPress bővítmény Download Monitor néven, amit
Egy pár aktuális sztár mellett szoktam hozni olyan .png képeket is, akik az én kedvenceim közé tartoznak. Ilyen Elizabeth Mitchell színésznő is. Szerettem anno a Lost sorozatban is, de
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 02.

 


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-02-03.js, kepvalto-fejlec-script-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-02-03.js"></script>
<script src="/js/kepvalto-fejlec-script-02.js"></script>
<script type="text/javascript">
var firstbgcarousel=new bgCarousel({
    wrapperid: 'mybgcarousel', //ID of blank DIV on page to house carousel
    imagearray: [
        ['/images/scripts/kepvalto-fejlec/02/001.png', 'Ha ide szöveget is szeretnél, megjelenik a képen :D'], //["image_path", "optional description"]
        ['/images/scripts/kepvalto-fejlec/02/002.png', ''],
        ['/images/scripts/kepvalto-fejlec/02/003.png', ''],
        ['/images/scripts/kepvalto-fejlec/02/004.png', ''],
        ['/images/scripts/kepvalto-fejlec/02/005.png', 'Lauren Graham'] //<--no trailing comma after very last image element!
    ],
    displaymode: {type:'auto', pause:3000, cycles:2, stoponclick:false, pauseonmouseover:true},
    navbuttons: ['/images/scripts/kepvalto-fejlec/02/jobbra-nyil.gif', '/images/scripts/kepvalto-fejlec/02/balra-nyil.gif', '', ''], // path to nav images
    activeslideclass: 'selectedslide', // CSS class that gets added to currently shown DIV slide
    orientation: 'h', //Valid values: "h" or "v"
    persist: true, //remember last viewed slide and recall within same session?
    slideduration: 500 //transition duration (milliseconds)
})
</script>


CSS kód
 

<div class="bgcarousel" id="mybgcarousel"></div>
<style type="text/css">
div.bgcarousel{
background: black url(/images/scripts/kepvalto-fejlec/02/001.gif) center center no-repeat;
width:483px; /* képeid szélessége */
height:400px; /* képeid magassága */
}
img.navbutton{
margin:5px;
opacity:0.7;
}
div.slide{
background-color: black;
background-position: center center;
background-repeat: no-repeat;
background-size: cover;
color: black;
}
div.selectedslide{
}
div.slide div.desc{
position: absolute;
color: #000000; /* a szöveg színe, ami megjelenik a képeken */
left: 40px; /* a szöveg elhelyezkedése balról */
top: 20px; /* a szöveg elhelyezkedése fentről */
width:250px; /* a szöveg milyen hosszan foglaljon helyet a képen */
padding: 10px;
font: bold 16px Georgia; /* a szöveg stílusai */
text-shadow: 2px 2px 2px #ffffff; /* árnyék a szövegnek */
z-index:5;
}
div.selectedslide div.desc{
}
div.slide div.desc h2{
font-size:150%;
margin:0;
}
div.slide div.desc a{
color:yellow;
text-decoration:none;
}</style>

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

Hozzászólások