sannas rum -

› Ny design 13O42O click
› Nya tutorials 13O428 click
› Ny gratisdesign 13O417 click

AMANDAH CAMILLA H CAMILLA J DANIELLA DAVID DITTE ELIN EMMA HELENE JULIA KAROLINA LILLAGE LINNEA MARTINA NATHALIE ROBERTO SARA VIOLA

Bildspel i headern

tisdag › 4 september › 13.07

Stilmallskoden (klistra in vart som helst i stilmallen):

Scriptkoden (klistra in innan /head):

<script type="text/javascript">
// Browser Slide-Show script. With image cross fade effect for those browsers
// that support it.
// Script copyright (C) 2004-2011 www.cryer.co.uk.
// Script is free to use provided this copyright header is included.
var FadeDurationMS=1000;
function SetOpacity(object,opacityPct)
{
// IE.
object.style.filter = 'alpha(opacity=' + opacityPct + ')';
// Old mozilla and firefox
object.style.MozOpacity = opacityPct/100;
// Everything else.
object.style.opacity = opacityPct/100;
}
function ChangeOpacity(id,msDuration,msStart,fromO,toO)
{
var element=document.getElementById(id);
var msNow = (new Date()).getTime();
var opacity = fromO + (toO - fromO) * (msNow - msStart) / msDuration;
if (opacity>=100)
{
SetOpacity(element,100);
element.timer = undefined;
}
else if (opacity<=0)
{
SetOpacity(element,0);
element.timer = undefined;
}
else
{
SetOpacity(element,opacity);
element.timer = window.setTimeout("ChangeOpacity('" + id + "'," + msDuration + "," + msStart + "," + fromO + "," + toO + ")",10);
}
}
function FadeInImage(foregroundID,newImage,backgroundID)
{
var foreground=document.getElementById(foregroundID);
if (foreground.timer) window.clearTimeout(foreground.timer);
if (backgroundID)
{
var background=document.getElementById(backgroundID);
if (background)
{
if (background.src)
{
foreground.src = background.src;
SetOpacity(foreground,100);
}
background.src = newImage;
background.style.backgroundImage = 'url(' + newImage + ')';
background.style.backgroundRepeat = 'no-repeat';
var startMS = (new Date()).getTime();
foreground.timer = window.setTimeout("ChangeOpacity('" + foregroundID + "'," + FadeDurationMS + "," + startMS + ",100,0)",10);
}
} else {
foreground.src = newImage;
}
}
var slideCache = new Array();
function RunSlideShow(pictureID,backgroundID,imageFiles,displaySecs)
{
var imageSeparator = imageFiles.indexOf(";");
var nextImage = imageFiles.substring(0,imageSeparator);
if (slideCache[nextImage] && slideCache[nextImage].loaded)
{
FadeInImage(pictureID,nextImage,backgroundID);
var futureImages = imageFiles.substring(imageSeparator+1,imageFiles.length)
+ ';' + nextImage;
setTimeout("RunSlideShow('"+pictureID+"','"+backgroundID+"','"+futureImages+"',"+displaySecs+")",
displaySecs*1000);
// Identify the next image to cache.
imageSeparator = futureImages.indexOf(";");
nextImage = futureImages.substring(0,imageSeparator);
} else {
setTimeout("RunSlideShow('"+pictureID+"','"+backgroundID+"','"+imageFiles+"',"+displaySecs+")",
250);
}
// Cache the next image to improve performance.
if (slideCache[nextImage] == null)
{
slideCache[nextImage] = new Image;
slideCache[nextImage].loaded = false;
slideCache[nextImage].onload = function(){this.loaded=true};
slideCache[nextImage].src = nextImage;
}
}
</script><head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
 
<script src="fadeslideshow.js">
 
/***********************************************
* Ultimate Fade In Slideshow v2.0- (c) Dynamic Drive DHTML code library (www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for this script and 100s more
***********************************************/
<script>var slide1foldername='';</script><script charset="utf-8" src="slide1.js"></script>
</script>
 
<script>
 
var mygallery=new fadeSlideShow({
wrapperid: "fadeshow1", //ID of blank DIV on page to house Slideshow
dimensions: [250, 180], //width/height of gallery in pixels. Should reflect dimensions of largest image
imagearray: [
["http://i26.tinypic.com/11l7ls0.jpg", "", "", "Nothing beats relaxing next to the pool when the weather is hot."],
["http://i29.tinypic.com/xp3hns.jpg", "http://en.wikipedia.org/wiki/Cave", "_new", "Some day I'd like to explore these caves!"],
["http://i30.tinypic.com/531q3n.jpg"],
["http://i31.tinypic.com/119w28m.jpg", "", "", "What a beautiful scene with everything changing colors."] //<--no trailing comma after very last image element!
],
displaymode: {type:'auto', pause:2500, cycles:0, wraparound:false},
persist: false, //remember last viewed slide and recall within same session?
fadeduration: 500, //transition duration (milliseconds)
descreveal: "ondemand",
togglerid: ""
})
 
 
var mygallery2=new fadeSlideShow({
wrapperid: "fadeshow2", //ID of blank DIV on page to house Slideshow
dimensions: [250, 180], //width/height of gallery in pixels. Should reflect dimensions of largest image
imagearray: [
["http://i26.tinypic.com/11l7ls0.jpg", "", "", "Nothing beats relaxing next to the pool when the weather is hot."],
["http://i29.tinypic.com/xp3hns.jpg", "http://en.wikipedia.org/wiki/Cave", "_new", "Some day I'd like to explore these caves!"],
["http://i30.tinypic.com/531q3n.jpg"],
["http://i31.tinypic.com/119w28m.jpg", "", "", "What a beautiful scene with everything changing colors."] //<--no trailing comma after very last image element!
],
displaymode: {type:'manual', pause:2500, cycles:0, wraparound:false},
persist: false, //remember last viewed slide and recall within same session?
fadeduration: 500, //transition duration (milliseconds)
descreveal: "always",
togglerid: "fadeshow2toggler"
})
 
</script>

Kodmallskoden (klistra in efter div id="wrapper"):

För att justera vart denna slideshow/bildspelet ligger så kan du ändra i stilmallskoden vid margin. Om du lägger till margin-left etc. så kan du flytta runt den så att den passar din blogg. Har du frågor kan du lämna en kommentar!

allmänt, tips & tricks

4 kommentarer

Hej Sanna!
Super bra och tydliga filmer. Till stor hjälp! Vad jag undrar är hur och vilka program du använder dig av för att filma det du göra på datorn. Alltså hur du filmar skärmen under tiden som du pratar.
Hälsningar Alexandra

Svar: Jag använder IshowUHD (:

sannas rum

Sanna Sjöstrand★

Hej jag vet att du tar betalt egentligen :( men alltså jag förstår verkligen inte det här med bildspel, jag har försökt men det blir bara fel..

Svar: Vad är det du inte förstår ?

sannas rum

Jag har gjort allt som du har sagt och det ser fint ut och så där, men det blir inget bildspel, det blir bara första bilden.. Vet du hur man fixar det? Tacksam för svar :)

Svar: har du lagt semikolon mellan varje bild i andra scriptet? :)

sannas rum

Det funkar, men kan man ändra snabbheten? alltså hur lång tid det ska ta innan den byter bild? :)

Svar: Det tror jag tyvärr inte att man kan i och med att detta är ett script. men du kan ju prova dig fram angående siffrorna i själva scriptet, se om det händer något om du ändrar liksom :)

sannas rum

» Jag hjälper till med kodning. Klicka här för priser.
» Jag säljer unika, personliga designer & headers.
» Jag tillhandahåller även nedladdningsbara gratisdesigner - klicka här.
» Behöver du hjälp med dessa hänvisar jag dig antingen till Hjälp med kodning eller till min bloggtipssida.
» Om du har designfrågor hänvisar jag dig till min bloggtipssida.
» Inga beställningsdesigner är gratis!
» Det märks om du är lat - kolla på mina tips innan du ställer frågor!
» ... frågor som uppenbart redan blivit besvarade besvaras inte igen.
» Har du frågor om bloggdesign så kan du ge mig tips om vad jag kan visa, får du inget svar beror det på att jag redan har visat det.
» Jag besvarar inte mail eller kommentarer om enskilda fall i stil med "vet du vad jag har gjort fel?" - vill du ha hjälp med kodning är det sidan Hjälp med kodning som gäller om inte min bloggtipssida hjälpt dig tidigare.
» Vill du ändå kontakta mig? Gör det på info@sannasrum.se

Symboler för din kommentar hittar du här (öppnas i ett nytt fönster)

NAMN
Kom ihåg mig?

EMAIL (publiceras ej)

BLOGG

KOMMENTAR

TILLBAKA TILL STARTSIDAN

THE DESIRE TO CREATE IS ONE OF THE DEEPEST YEARNINGS OF THE HUMAN SOUL.

~ Dieter F. Uchtdorf

Senaste inläggen

Arkiv

2013 januari februari mars april maj
2012 januari februari mars april maj juni juli augusti september oktober november december
2011 januari februari mars april maj juni juli augusti september oktober november december
2010 januari februari mars april maj juni juli augusti september oktober november december
2009 januari februari mars april maj juni juli augusti september oktober november december
2008 oktober november december

ADVERTISEMENT

Bingo

Vill du samarbeta med mig, antingen med inlägg eller med länkar ?
Maila annons@sannasrum.se