30 October 2011

Tutorial Floating Image Hover

Kod bawah ni Aisyah yang buat sendiri .

1 . Masuk ke HTML/JavaScript

2 . Copy code bawah ni dan pastekan dalam kotak HTML/JavaScript .
<div id="img" style="position: fixed; left: 5px; bottom: 20px;">
<img src="url gambar 1" onmouseover="this.src='url gambar 2'" onmouseout="this.src='url gambar 1'" width="170" height="270" />
</div>
Merah : Url gambar 1
Biru : Url gambar 2 
Pink : Kelebaran Gambar
Hijau : Keinggian Gambar


♥ Da siap save je lah terus :-) . ♥

27 October 2011

Comelnye


Rase nak cubit pipi kucing ni . Comel la kucing ni . 

Tutorial Meletakkan Gambar Di Sidebar

1. Dashboard > Design > Add Gadget > Html/JavaScript

2. Paste kod di bawah ini , di ruangan Html/JavaScript itu .
<center><img src="URL GAMBAR KORANG"/></center>

*Kat mana nak amik URL Gambar Korang Sendiri ? Korang boleh upload kat SINI 
*Lepas sudah upload , korang copy code yang bawah sekali tu (Direct Link). Ada paham ?

3. Paste URL korang tuh .
So , bila dah siap , SAVE !

Credit : Lyssa

Tutorial Double Dashed Hover

1 . Dashboard > Design > Edit Html

2. Tekan Ctrl+F dgn serentak .. dan cari kod ini .. :

a:hover

3. Lepas korang jumpa . korang paste kan pulak kod kt ini kat bawah kod yang korang carikan tadi tuh ....
border-top: 2px dashed #ff8fc1;
border-bottom: 2px dashed #ff8fc1;

 Korang boleh tukarkan kod warna merah diatas .dgn kod warna anda sendiri

4. Da siap . SAVE ! :) Lihat lah hasilnya ya! :)
Tutorial from lyssasecret

Tutorial : Round Hover With Shadow

1. Log in > Dashboard > Design > Edit Html > Tick Expand Widget Templates

2. Tekan F3 atau Ctrl+F search kod kat bawah ini :
/* Header

3. Dah jumpa ? Oke . paste kod ini pula kat ATAS kod yg korang cari tadi tu ok ? :)

 /*------ IMAGE ANIMATION------*/
img {filter:alpha(opacity=100);
-webkit-transition-duration:.5s;} img:hover {filter: alpha(opacity=60); opacity: .6; -webkit-box-shadow: 0px 0px 20px #FF3366; -moz-box-shadow: 0px 0px 20px #FF3366; -webkit-border-top-right-radius:30; -webkit-border-top-left-radius:30; -webkit-border-bottom-right-radius:30; -webkit-border-bottom-left-radius:30;}img:hover {filter: alpha(opacity=60); opacity: .60; border: 1px solid#FF3366; border-radius: 50px; -moz-border-radius: 50px;}
-moz-opacity:1.0;
opacity:1.0;
}
img:hover {
filter:alpha(opacity=80);
-moz-opacity:0.80;
opacity:.80;
}
u {
text-decoration:underline;
border-bottom: 2px dotted #ff0080;
padding: 0px;
}

Tukar kod colour pink tu color yang korang suka ok .

4. Da siap . SAVE !

Credit : lyssasecret

26 October 2011

Tutorial Letak Salji Dalam Blog Ver 2


Tutorial untuk letak salji ini seperti berikut.

1. Dari dashboard > design > add a gadget > HTML javascript

2. Copy dan paste kod salji mengikut warna yang anda mahu ke dalam HTML/javascript

Putih
Tutorial Letak Salji Dalam Blog
<script type="text/javascript" src="https://sites.google.com/site/unwanted86/javascript/snowwhite.js"></script>

Purple
Tutorial Letak Salji Dalam Blog
<script type="text/javascript" src="https://sites.google.com/site/unwanted86/javascript/snowpurple.js"></script>

Hitam
Tutorial Letak Salji Dalam Blog
<script type="text/javascript" src="https://sites.google.com/site/unwanted86/javascript/snowblack.js"></script>

Biru
Tutorial Letak Salji Dalam Blog
<script type="text/javascript" src="https://sites.google.com/site/unwanted86/javascript/snowblue.js"></script>

Merah
Tutorial Letak Salji Dalam Blog
<script type="text/javascript" src="https://sites.google.com/site/unwanted86/javascript/snowred.js"></script>

3. Save dan lihat hasilnya.:)

Nota: Drag element ada ke bawah 'header' supaya salji muncul dari atas page blog korang.:)

Letak kesan salji dalam blog (Snow effect)

Letak kesan salji dalam blog (Snow effect)


Cara untuk meletakkan salji dalam blog adalah seperti berikut.

1. Login akaun blogger, dari dashboard>layout>add a gadget>html/javascript

2. Copy salah satu kod berikut kemudian paste dalam ruangan html/javascript

Kod untuk salji putih (sesuai untuk background hitam)
<script type="text/javascript" src="http://www.yourjavascript.com/14104214083/snow-white.js"></script>

Kod untuk salji hitam (sesuai untuk background putih)
<script type="text/javascript" src="http://www.yourjavascript.com/03441140321/snow-black.js"></script>

3. Save dan lihat hasilnya.:)

Tutorial Kelopak Bunga Berguguran Di Blog

Credit : Tutorial untuk blog

1. Dari dashboard > design > add a gadget > HTML/javascript

2. Copy dan paste kod di bawah ke dalam ruangan HTML/javascript yang anda buka
<script>if(typeof jQuery=='undefined'){document.write('<'+'script');document.write(' language="javascript"');document.write(' type="text/javascript"');document.write(' src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js">');document.write('</'+'script'+'>')}</script><script>if(!image_urls){var image_urls=Array()}if(!flash_urls){var flash_urls=Array()}image_urls['rain1']="http://2.bp.blogspot.com/-IQXNv-_CBLE/TpWcK7LL4VI/AAAAAAAAG0I/bcxYcqc_uI0/pinkpetal1.png";image_urls['rain2']="http://4.bp.blogspot.com/-teXCIicWPF4/TpWcLLg0A2I/AAAAAAAAG0U/IPPCr1gponc/pinkpetal2.png";image_urls['rain3']="http://3.bp.blogspot.com/-3JG9HLECCRU/TpWcLZGSYtI/AAAAAAAAG0g/zIJINua93TE/redpetal1.png";image_urls['rain4']="http://2.bp.blogspot.com/-BByhQEK5E24/TpWcLux4xRI/AAAAAAAAG0s/x2hIr1AV_Ac/redpetal2.png";$(document).ready(function(){var c=$(window).width();var d=$(window).height();var e=function(a,b){return Math.round(a+(Math.random()*(b-a)))};var f=function(a){setTimeout(function(){a.css({left:e(0,c)+'px',top:'-30px',display:'block',opacity:'0.'+e(10,100)}).animate({top:(d-10)+'px'},e(7500,8000),function(){$(this).fadeOut('slow',function(){f(a)})})},e(1,8000))};$('<div></div>').attr('id','rainDiv')
.css({position:'fixed',width:(c-20)+'px',height:'1px',left:'0px',top:'-5px',display:'block'}).appendTo('body');for(var i=1;i<=20;i++){var g=$('<img/>').attr('src',image_urls['rain'+e(1,4)])
.css({position:'absolute',left:e(0,c)+'px',top:'-30px',display:'block',opacity:'0.'+e(10,100),'margin-left':0}).addClass('rainDrop').appendTo('#rainDiv');f(g);g=null};var h=0;var j=0;$(window).resize(function(){c=$(window).width();d=$(window).height()})});</script>
<script>if(typeof jQuery=='undefined'){document.write('<'+'script');document.write(' language="javascript"');document.write(' type="text/javascript"');document.write(' src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js">');document.write('</'+'script'+'>')}</script><script>$(document).ready(function(){var a=$('<img>').attr({'src':'http://2.bp.blogspot.com/-IQXNv-_CBLE/TpWcK7LL4VI/AAAAAAAAG0I/bcxYcqc_uI0/pinkpetal1.png','border':0});$('<a></a>').css({position:'absolute',right:'0px',top:'22px','z-index':'90'}).attr({'href':'http://tutorialuntukblog.blogspot.com/2011/10/tutorial-kelopak-bunga-berguguran-di.html'}).append(a).appendTo('body')});</script>

3. Save dan lihat hasilnya.:)

Credit : Tutorial untuk blog

Comel tak banner Aisyah buat hari ni


Comel tak banner arnab ni ? Aisyah suke arnab ni rase nak cubit je pipi arnab ni sebab comel . Buat banner ni senang je . Heheheheh . Aisyah suke arnab kartun ni sebab comel . Sebenarnye arnab ni Aisyah yang lukis . Kalau suke arnab kartun yang Aisyah lukis ni komenlah sikit yehh .

Freebies

jom nyanyiFreebies

Freebies : Background part 1

 Nak bagi freebies lagi lah....
Credit : ferny.dailycute.net

      
      
    
      
      
     
      
      
      
     
     
     
     
     
       
      
  
  
     
     
     
     
  
  

Credit : ferny.dailycute.net