2017. 11. 27.Coppermine | Egérre felugró ablak tartalmának megváltoztatása
2017. 11. 26.GIF készítése egy pillanat alatt
2017. 11. 26.FREE theme | Dakota Johnson WordPress theme
2017. 11. 25.WordPress alapvető használata
2017. 11. 24.Ingyenes | Eliza Taylor G-Portálos téma
009.png

Eliza Taylor

001.png

Little Mix

040.png

Gal Gadot

008.png

Girls' Generation

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>


1 456 megtekintés

Hozzászólások