Rollover image


Ibland kan vanliga länkar som ändrar färg bli lite tråkiga och man istället vill ha bilder. Otroligt mycket snyggare och inte så mycket svårare egentligen, bara man vet hur man gör. Rollover image alltså.

För att få det att funka måste man använda sig av ett javascript. Javascript klistras enkelt in i kodmallen/HTML-dokumentet. Den kod du behöver är den här och den läggs direkt under <head>:

<script type=”text/javascript”>
function MM_swapImgRestore() { //v3.0
var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
}
function MM_preloadImages() { //v3.0
var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
if (a[i].indexOf(”#”)!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}

function MM_findObj(n, d) { //v4.01
var p,i,x;  if(!d) d=document; if((p=n.indexOf(”?”))>0&&parent.frames.length) {
d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
if(!x && d.getElementById) x=d.getElementById(n); return x;
}

function MM_swapImage() { //v3.0
var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}
</script>

När det är klart måste du lägga upp en bit kod och bilderna du vill använda i kodmallen/HTML-dokumentet.
Du lägger det där du vill att den ska visas. Exempelvis om du vill ha det i menyn så lägg det under <side>.

<a href=”ADRESS VID KLICK” onmouseout=”MM_swapImgRestore()” onmouseover=”MM_swapImage(‘Ewra’,”,’bild2.jpg’,1)”><img src=”bild1.jpg” alt=”Ewra” name=”Ewra” width=”200″ height=”100″ border=”0″ id=”Ewra” /></a>

BYT UT DETTA:
Vid ADRESS VID KLICK klistrar ni själva in den adress ni vill att man ska komma till när man klickar.
Bild2.jpg står för bild nummer två som visas (när man drar musen över)
Bild1.jpg är den bilden som visas när musen inte är över bilden.
Där det står Ewra byter ni själva ut till något kort som beskriver bilden (Det är för de som inte kan se bilder)

Sedan är det klart!
Tyvärr blir det inga bilder till denna tutorial men om det är något som inte funkar är det bara att lämna en kommentar här nedanför!

Sandra i medialabbet

Tillbaka i Jönköping och redovisningen är klar. Imorgon är det bara en dag kvar till examen, gaah! Helt sjukt, jag kommer sakna så otroligt mycket här i Jönet. Allra mest Sandra!

Ett klipp en sen Novemberkväll förra året då vi redigerade vår informationsfilm i Marknadskommunikation 2, Sandra och jag var lite trötta efter en lång dag och hittade på lite roligare saker – att göra en åkning på, tro det eller ej, fötter.

Oxfilé och Ben & Jerry

Oxfilén vi skulle äta ikväll hoppade ifrån grillen och det dåliga vädret och ska istället landa på en plankstek! Riktigt gott, plus en examen på det här om mindre än en vecka sitter inte fel. En trevlig hemmakväll blir det ikväll! Det är tur att inte pappat läser min blogg, i frysen ligger nämligen en Ben & Jerrys Chocolate Fudge Brownie och väntar på mig, och vad jag har väntat på den! Med andra ord, det blir inget öltält för mig ikväll.

Illustrator

I brist på annat (och för att jag har tröttnat på rapporten) försöker jag bättra på min vänskap med min halvfiende Illustrator. Här får ni en sneakpeak på vad jag skapar. Jag har en grej för att göra tekniska prylar? Min första ”riktiga” illustration jag gjorde föreställde ett Xbox, dock var det syster som tyckte jag skulle göra det. Men tekniska prylar är roliga, det finns många små och roliga detaljer blandat med stora ytor.

Illustration

Skugga runt bloggen/hemsidan

Något som är väldigt snyggt just nu är att ha på en liten skugga runt bloggen eller hemsidan. Det är superenkelt att göra och tar bara två kodrader.

Skugga på blogg/hemsida

Börja med att gå in i stilmallen. Leta upp det avsnitt du vill ha en skugga bakom (Wrapper=hela bloggen/hemsidan, Content=inläggen, Side=menyn till höger/vänster och header). I mitt fall har jag valt att lägga det runt hela bloggen, alltså runt wrappern.

Det här är koden du ska klistra in i stilmallen:
-moz-box-shadow: 0px 0px 10px #403f3f;
box-shadow: 0px 0px 10px #403f3f;

Du väljer själv hur ljus/mörk du vill ha skuggan genom att ändra på dessa (endast sifforna/bokstäverna): #403f3f. En bra guide för vilka färger som finns och vilka kombinationer de har finns här

Del 1

En vecka

Om en vecka är mina två år på Grafisk design och webbutveckling över. Jag kan inte riktigt säga att mina två år på Tekniska högskolan är över, jag får se om jag kan säga det i sommar eller om jag får vänta med att säga det ett år till. Hursomhelst, idag är det bara en vecka kvar. Det känns otroligt skönt men samtidigt helkonstigt, som alltid(?). Vad kommer att hända sedan? Med allt & alla? Det är tur att jag har min Sandra och att förhoppningsvis kan bli 08 för några dagar och hälsa på henne i sommar!

Laktosfria minicupcakes

För några dagar sedan passade jag och syster på att göra cupcakes. Eftersom hon är laktosintollerant gjorde vi en annan variant och resultatet blev inte så pjåkigt i alla fall. Här är receptet;

150g laktosfritt/mjölkfritt smör
2 1/2 dl strösocker
1 dl kakao
2 tsk vaniljsocker
2 ägg
2 dl vetemjöl

Frosting:
50g laktosfritt/mjölkfritt smör

200g Tofulines creamy spread naturell (philadelphiaost)

2 tsk vaniljsocker
florsocker

Gör såhär:
Sätt ugnen på 175°. Smält smöret i en kastrull. Lyft av kastrullen från plattan. Rör ner socker, kakao och vaniljsocker. Rör ner ett ägg i taget och till sist mjölet. Klicka ut smeten i pappersformar. Grädda i mitten av ugnen 12–14 min.

Frosting
Vispa smöret så det mjuknar. Tillsätt creamy spread och vispa ihop det till en jämn smet. Ett bra tips om det inte finns/inte hittar Creamy spread är att istället ta laktosfri Creme fraiche och tillsätta lite vaniljsocker. På det sättet får man fram samma smak som philadelphiaost, dock blir det lite ”lösare” massa. Efter att smöret och creamy spread/creme fraichen är ihopvispade tillsätt vaniljsockret och florsocker. Florsockret varierar beroende på hur mycket man själv vill ha i.

SuperSnabbaSilverSara

Klokan är 9.44 och jag har nästan redan hunnit med mer saker än vad jag gjorde på hela dagen igår. Jag gick upp med syster vid halv 8 och har redan hunnit med frukost, BTS på Harry Potter och dödsrelikerna del 1 (eller Harry Potter and the deathly hallows part 1, Jossie!?), kollat på Jims värld och möblerat om & fixat med mitt rum/kontoret/gästrummet. Nu ska jag jobba vidare med bloggdesignen åt Emma och sedan blir det att skriva rapport, mums!

Egen ikon till blogg/hemsida

I denna nya fräscha kategori kommer jag att samla lite bra-att-ha tutorials för mindre hemsidor och bloggar. Vi börjar med ett sätt som gör hemsidan lite extra snygg och något som framförallt väldigt många glömmer. En egen ikon på din blogg eller din hemsida! Det är superenkelt att göra och tar väldigt lite tid.

Del 1

Börja med att göra den bild som du vill ha. Bilden ska vara 16 x 16 pixlar stor. Om du vill slippa en vit ruta runt om din ikon välj att ha inte ha något bakgrundslager, precis såhär:

Spara bilden som png.

Ladda upp bilden på tinypic eller där du brukar ladda upp dina bilder. Vart spelar inte någon större roll. Kopiera bildens url. Följande kodrad ska klistras in i kodmallen/HTML-dokumentet direkt under <head>.

<link href=”bildens url” rel=”shortcut icon”>
(byt ut ”bildens url” till din bilds url)

Precis såhär;
Glöm inte att göra det på varje kodmall/HTML-dokument så det visas på alla sidor.

Del 2

Spara sedan och kolla om det fungerar. Det borde se ut någonting såhär!

Del3

Före & Efter

Förlåt!

Shit, bloggen är verkligen stendöd, och allt är ju såklart mitt fel. Men ändringar ska det bli! Som ni kanske ser (eller inte ser?) har jag lagt till en kategori. Jag kommer börja med lite tutorials här på bloggen. Jag hoppas på att lägga ut den första redan ikväll, håll ögon och öron öppna!

I främmande farvatten

Igår var jag, mamma, pappa och syster och såg den fjärde filmen i Pirates of Caribbean-serien – I främmande farvatten. Jag tycker att det är lite tråkigt att både Orlando Bloom och Keira Knightley inte längre är med på vita duken tillsammans med Jack Sparrow. Men trots det höll filmen måttet och var, precis som de andra filmerna, rolig, spännande och otroligt häftig. Jag älskar alla detaljer som finns i varje liten del av filmen, och självklart – musiken. Vi alla fyra gick hem nynnandes på introlåten, haha!

Nu ska jag snart se gårdagens Grey’s avsnitt som jag missade igår, spännande!

Praktik och statistik

Igår var sista riktiga dagen på praktiken, jag rensade skrivbordet och gjorde rent och fint efter mig. Jag kommer fortfarande att jobba med småprojekt fram till fredag då praktiken är slut på riktigt, men det på hemmaplan.

Komiskt nog så var jag inne och kollade på statistiken. Hemsidan har, förutom bloggen, en egen statistik. Så jag kan enkelt se hur många som besöker bloggen, och hur många som besöker hemsidan. Hemsidan har i snitt mer än dubbelt så många besökare än bloggen. Det tycker jag är lite komiskt med tanke på att bloggen har funnit sedan -08 och hemsidan i.. drygt en vecka. Men jag gillar det, fortsätt så!

Nya Ewra.se

Ja, bloggen har fått sig ett ansiktslyft och är nu större en någonsin. Eller ja, bloggen är lika stor men den har fått sällskap av en hemsida. Jag hoppas att allt fungerar som det mer eller mindre ska vid den här tiden efter allt domänflytt och problem som har varit.

Just nu har jag tillsammans med syster åkt tillbaka i tiden och sitter och pluggar Matte B. Usch, denna hemska tid med Matte B, jag är glad att det är över för mig och att jag istället får jobba med roliga saker, som att bygga upp denna hemsida. Hoppas ni inte blir allt för förvirrade av alla nya länkar. (Om ni inte ser den nya designen eller har problem att se vissa saker, tryck F5 eller uppdatera sidan)


Liza!

Få uppdateringar och stora planer

Ja, jag har varit lite dålig på att blogga den senaste tiden. Men ni som läser min twitter har väl troligen listat ut varför. Jag håller nämligen på med en stor makeover av hela bloggen och skapar även en hemsida vid sidan om. Just nu väntar jag på att få min domän överförd från Binero till One, så förhoppningsvis har det hänt saker här i slutet på nästa vecka!

Idag träffade jag äntligen Sandra efter att vi nästan inte har setts på två månader, som jag har saknat henne! Inte nog med det fick jag jätte fina presenter, gulle! Nu ska jag kolla på Lyxfällan innan det är dags att krypa ner i sängen, ciao!