klintan - Foto och kreativitet i mängder!

2012-04-18

Stor förändring

Har legat hemma med migrän idag, usch vad det är jobbigt! Men har tack och lov piggnat till lite nu! Tänkte därför passa på att lägga upp den nya designen. Gjorde den förra veckan men har inte haft tid att lägga upp den. Så tryck F5 och kommentera vad ni tycker! Haha kanske att jag inte ska byta design så ofta? ;)

Här ser ni förändringen i alla fall! :)

Kategori: Bloggdesign

Kommentarer (1)

2012-01-12

Helt sprillans ny design på bloggen. Väldigt annorlunda mot den gamla men kände att jag ville ha en nystart! :)
Hoppas ni tycker om den, ni måste nog uppdatera (F5) för att kunna se den!

Gamla inlägg kanske ser lite konstiga ut men det får ni stå ut med! :)

Kategori: Bloggdesign

Kommentarer (1)

2011-10-23

Tänkte förklara hur man kan göra ett bildspel på bloggen, t.ex i headern (funkar på blogg.se).

Först kopierar du denna koden:

// 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>  <mce:script mce_src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></mce:script>     <mce:script mce_src="/2204068/entries/article/new/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=''; // --></mce:script><mce:script charset="utf-8" mce_src="/2204068/entries/article/new/slide1.js"></mce:script>  </script>     <mce:script type="text/javascript"><!--    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"  })    // --></mce:script> <mce:script LANGUAGE="JavaScript"><!-- // This is the implementation of SimpleSwap // by Jehiah Czebotar // Version 1.1 - June 10, 2005 // Distributed under Creative Commons // // Include this script on your page // then make image rollovers simple like: // <img src="/images/ss_img.gif" mce_src="/images/ss_img.gif" oversrc="/images/ss_img_over.gif"> // // http://jehiah.com/archive/simple-swap // function SimpleSwap(el,which){ el.src=el.getAttribute(which || "origsrc"); } function SimpleSwapSetup(){ var x = document.getElementsByTagName("img"); for (var i=0;i<x.length;i++){ var oversrc = x[i].getAttribute("oversrc"); if (!oversrc) continue; // preload image // comment the next two lines to disable image pre-loading x[i].oversrc_img = new Image(); x[i].oversrc_img.src=oversrc; // set event handlers x[i].onmouseover = new Function("SimpleSwap(this,'oversrc');"); x[i].onmouseout = new Function("SimpleSwap(this);"); // save original src x[i].setAttribute("origsrc",x[i].src); } } var PreSimpleSwapOnload =(window.onload)? window.onload : function(){}; window.onload = function(){PreSimpleSwapOnload(); SimpleSwapSetup();} // --></mce:script>

sedan klistrar du in den mellan <head> & </head> i ALLA kodmallarna.

Sedan kopierar du denna koden:

<div id="EmilyPictureBackground">   <img alt="slide show" src="http://ADRESSTILLBILDNUMMER1" mce_src="http://ADRESSTILLBILDNUMMER1" width="BREDDENPÅBILDERNApx" height="HÖJDENPÅBILDERNApx" id="EmilyPicture"> </div> <mce:script type="text/javascript"><!-- RunSlideShow("EmilyPicture","EmilyPictureBackground","http://ADRESSTILLBILDNUMMER1IGEN";"http://ADRESSTILLBILDNUMMER2";"http://ADRESSTILLBILDNUMMER3”;”OSV”,5); // --></mce:script>

den klistrar du in mellan <div id="header"> & </div> (om du vill ha bildspelet i headern), i alla kodmallarna.

Sedan skriver du i bredden & höjden på dina bilder (bra om du sparar de bilder du vill ha med samma mått), laddar upp dem
och kopierar in adresserna till dem där det står "ADRESSTILLBILD".

(Glöm inte att ta bort din gamla header och att ändra storleken på headern i stilmallen så att den har samma mått som bildspelet!

Om något inte funkar så är det bara att fråga! :)

Kategori: Bloggdesign

Kommentarer (0)

2011-10-04

Helt nytt
Var väldigt trött på den gamla designen så nu blir det helt nytt. Tryck F5 om något ser konstigt ut, och ni får gärna skriva vad ni tycker! :)

Jag ska återvända till mina fysik böcker...

Kategori: Bloggdesign

Kommentarer (0)

2011-08-16

Gjorde om designen lite nu igen, men ville ha ett bildspel i headern.
Är ganska nöjd med den nu så den får kanske stanna ett tag. :)

Kategori: Bloggdesign

Kommentarer (1)

2011-08-02

Har gjort om designen en del. Tröttnade ganska fort på den förra, får se hur länge denna får stanna nu. Tryck F5 om något ser konstigt ut. :)

Kategori: Bloggdesign

Kommentarer (0)

2011-07-14

Håller på att fixa en ny design så vissa saker kan se lite konstigt ut, får inte riktigt allt att stämma..

Kategori: Bloggdesign

Kommentarer (0)