Selasa, 31 Januari 2012

Tutorial cara letak tulisan pelangi di blog


Tulisan pelangi ni bukan la untuk link tapi ianya ialah javascript.. Aku jumpa script ni di site Javascript source

Live demo



Cara pasang diblog senang saja..

Mula2 pergi ke desbod---design---ada gadget--- html / javascript...

Kemudian copy dan paste code di bawah..




<script type="text/javascript">
<!-- Begin
/*Tutorial By P0L5K4H4CKR3W
This script and many more are available free online at
The JavaScript Source!! http://javascript.internet.com
Created by: HaganeNoKokoro :: http://tinyurl.com/buvp9 */

/*
* Notes on hue
*
* This script uses hue rotation in the following manner:
* hue=0 is red (#FF0000)
* hue=60 is yellow (#FFFF00)
* hue=120 is green (#00FF00)
* hue=180 is cyan (#00FFFF)
* hue=240 is blue (#0000FF)
* hue=300 is magenta (#FF00FF)
* hue=360 is hue=0 (#FF0000)
*
* Notes on the script
*
* This script should function in any browser that supports document.getElementById
* It has been tested in Netscape7, Mozilla Firefox 1.0, and Internet Explorer 6
*
* Accessibility
*
* The script does not write the string out, but rather takes it from an existing
* HTML element. Therefore, users with javascript disabled will not be adverely affected.
* They just won't get the pretty colors.
*/

/*
* splits par.firstChild.data into 1 span for each letter
* ARGUMENTS
* span - HTML element containing a text node as the only element
*/
function toSpans(span) {
var str=span.firstChild.data;
var a=str.length;
span.removeChild(span.firstChild);
for(var i=0; i<a; i++) {
var theSpan=document.createElement("SPAN");
theSpan.appendChild(document.createTextNode(str.charAt(i)));
span.appendChild(theSpan);
}
}

/*
* creates a rainbowspan object
* whose letters will be colored [deg] degrees of hue
* ARGUMENTS
* span - HTML element to apply the effect to (text only, no HTML)
* hue - what degree of hue to start at (0-359)
* deg - how many hue degrees should be traversed from beginning to end of the string (360 => once around, 720 => twice, etc)
* brt - brightness (0-255, 0 => black, 255 => full color)
* spd - how many ms between moveRainbow calls (less => faster)
* hspd - how many hue degrees to move every time moveRainbow is called (0-359, closer to 180 => faster)
*/
function RainbowSpan(span, hue, deg, brt, spd, hspd) {
this.deg=(deg==null?360:Math.abs(deg));
this.hue=(hue==null?0:Math.abs(hue)%360);
this.hspd=(hspd==null?3:Math.abs(hspd)%360);
this.length=span.firstChild.data.length;
this.span=span;
this.speed=(spd==null?50:Math.abs(spd));
this.hInc=this.deg/this.length;
this.brt=(brt==null?255:Math.abs(brt)%256);
this.timer=null;
toSpans(span);
this.moveRainbow();
}

/*
* sets the colors of the children of [this] as a hue-rotating rainbow starting at this.hue;
* requires something to manage ch externally
* I had to make the RainbowSpan class because M$IE wouldn't let me attach this prototype to [Object]
*/
RainbowSpan.prototype.moveRainbow = function() {
if(this.hue>359) this.hue-=360;
var color;
var b=this.brt;
var a=this.length;
var h=this.hue;

for(var i=0; i<a; i++) {

if(h>359) h-=360;

if(h<60) { color=Math.floor(((h)/60)*b); red=b;grn=color;blu=0; }
else if(h<120) { color=Math.floor(((h-60)/60)*b); red=b-color;grn=b;blu=0; }
else if(h<180) { color=Math.floor(((h-120)/60)*b); red=0;grn=b;blu=color; }
else if(h<240) { color=Math.floor(((h-180)/60)*b); red=0;grn=b-color;blu=b; }
else if(h<300) { color=Math.floor(((h-240)/60)*b); red=color;grn=0;blu=b; }
else { color=Math.floor(((h-300)/60)*b); red=b;grn=0;blu=b-color; }

h+=this.hInc;

this.span.childNodes[i].style.color="rgb("+red+", "+grn+", "+blu+")";
}
this.hue+=this.hspd;
}
// End -->
</script>


<div align="center">
<h1 id="r1">GANTIKAN TULISAN INI DENGAN AYAT ANDA</h1>
</div>
<script type="text/javascript">
var r1=document.getElementById("r1"); //get span to apply rainbow
var myRainbowSpan=new RainbowSpan(r1, 0, 360, 255, 50, 18); //apply static rainbow effect
myRainbowSpan.timer=window.setInterval("myRainbowSpan.moveRainbow()", myRainbowSpan.speed);
</script>

<div align="center">
<p id="r2">GANTIKAN TULISAN INI DENGAN AYAT ANDA</p>
</div>
<script type="text/javascript">
var r2=document.getElementById("r2"); //get span to apply rainbow
var myRainbowSpan2=new RainbowSpan(r2, 0, 360, 255, 50, 348); //apply static rainbow effect
myRainbowSpan2.timer=window.setInterval("myRainbowSpan2.moveRainbow()", myRainbowSpan2.speed);
</script>




Cara edit :

Cari perkataan GANTIKAN TULISAN INI DENGAN AYAT ANDA ... kemudian padam dan ganti dengan ayat power anda

Nota : jika anda ada menggunakan javascript yang mempunyai kata arahan yang sama dengan script ini.. kemungkinan script ini akan bug(tidak jadi)

Sekian

Tutorial cara letak scroll bar pada label HTML



Tutorial Request by Dee Ann




Bagi mereka yang mempunyai label yang banyak pasti serabut sidebar anda dengan label tu.. dulu label aku memang banyak.. tapi aku kurangkan agar lebih mudah dan tidak serabut..

Alternatif lain untuk memperkemaskan label ni adalah dengan meletakkan scrollbar pada label tu..

caranya senang saja.. dalam tutorial ni kita akan bermain dengan HTML..

Mula2 pergi ke desbod---design---edit html... kemudian tick pada expand widget template..

lepas tu cari code ni






<div expr:class='&quot;widget-content &quot; + data:display + &quot;-label-widget-content&quot;'>





bila jumpa code tu.. gantikan dengan code ni






<div expr:class='&quot;widget-content &quot; + data:display + &quot;-label-widget-content&quot;' style='height:300px;overflow:auto;'>





anda blh setkan ketinggian label mengikut kesesuaian blog anda.. cuma perlu edit angka 300 tu sahaja..

P.S / :Dee Ann untuk tutorial buat header,sy x blh buat sbb segala efek tulisan header tu sy main hentam ja.. haha.. apa yang penting kena ada software photoshop..

Sekian

Cara pasang lagu pada blog

pasang lagu pada blog
Ramai yang minta admin untuk buat tutorial ini, cara pasang lagu pada blog .Bagi yang berminat  berikut adalah cara membuatnya:



Dapatkan dulu senarai lagu dilaman web fullmusik.net/
Pada sebelah kanan web site terdapat senarai link lagu malaysia ,lagu barat,nasyid  dsbnya

pasang lagu pada blog


Klik pada link pilihan lagu yang anda pilih cth;seperti lagu Malaysia,klik butang GO
Kemudian senarai lagu akan muncul pada paparan berikutnya pilih  anda minati

lagu mp3

Setelah dipilih lagu tersebut akan muncul kod ditengah paparan web tadi
Salin kod tersebut

pasang lagu diblog

contoh kod seperti berikut:

<div style="text-align: center;">
<embed pluginspage="http://www.macromedia.com/go/getflashplayer" src="http://freewidget.info/izafullmusik/nasyid/14.7%20Solla_&%2339%3bAlaikallah_Imam_Muda_Najdir(www.fullmusik.net).swf" wmode="transparent" type="application/x-shockwave-flash" quality="high" title="Imam Muda Najdir - Solla Alaikallah@fullmusik" width="165" height="53"></embed></div>

Langkah seterusnya:
Setelah salin kod lagu tadi
1.Log in ke blog anda
2.Kemudian masuk ke design dan pilih Layout




3.Add a Gadget dan pilih HTML/Javascript







4.Kemudian masukkan kod tadi
5.Simpan untuk melihat hasilnya


klik butang +1 jika suka artikel ini :) :)

update 19/9/2014

Senin, 30 Januari 2012

Tutorial cara buat banner box bergerak


Bertukar banner sesama blogger adalah perkara yang bagus sangat2.. dan aku suka letak banner blogger2 lain walaupun aku sendiri x ada banner ketika entri ni di tulis.. hahaha

Tidak ada standard size untuk banner blogger,sebab tu ramai blogger buat banner ikut saiz yang mereka suka.. bagi aku saiz yang ideal 125 x 125.. tapi saiz tu kira besar jugak la.. klu banyak banner memang serabut la blog kau orang bila letak banner tu pada homepage..

terdapat banyak alternatif untuk kurangkan serabut tu.. tapi dalam entri ni alternatif yang aku guna ialah dengan cara buat scrolling box untuk banner tu.. senang ja..

Live Demo 1


Flying bat in a marqueeBlog RaDhio


Live Demo 2

Flying bat in a marqueeBlog RaDhio


Live Demo 3











Blog RaDhio




Live Demo 4



Blog RaDhio






Live Demo 5



Flying bat in a marquee









Blog RaDhio






Code 1 untuk Live Demo1



<marquee behavior="scroll" direction="left" style='width:129px;height:129px;' onmouseover="this.stop()" onmouseout="this.start()">

CodeBannerCodeBannerCodeBannerCodeBannerCodeBannerCodeBanner

</marquee>






Nota untuk code 1 : untuk code banner tu jgan bagi space.. rapatkan code tu


Code 2 untuk Live Demo2



<marquee behavior="scroll" direction="left" style='width:504px:height:129px;' onmouseover="this.stop()" onmouseout="this.start()">

CodeBannerCodeBannerCodeBannerCodeBannerCodeBannerCodeBanner

</marquee>




Nota untuk code 2 : sama seperti code 1..rapatkan code banner

Code3 untuk Live Demo3



<marquee behavior="scroll" direction="up" style='width:129px;height:504px;' onmouseover="this.stop()" onmouseout="this.start()">

Code Banner
Code Banner
Code Banner
Code Banner
Code Banner
Code Banner

</marquee>




Note untuk code 3 : susun code banner seperti diatas



Code 4 untuk Live Demo 4



<marquee behavior="alternate" direction="left" style='width:504px:height:129px;' onmouseover="this.stop()" onmouseout="this.start()">

CodeBannerCodeBannerCodeBannerCodeBannerCodeBannerCodeBanner

</marquee>




Nota untuk code 4 : sama seperti code 1 dan 2


Code 5 untuk Live Demo 5



<marquee behavior="alternate" direction="up" style='width:129px;height:504px;' onmouseover="this.stop()" onmouseout="this.start()">

Code Banner
Code Banner
Code Banner
Code Banner
Code Banner
Code Banner

</marquee>




Nota untuk code 5 : sama seperti code 3

Cara pasang di blog.. Pergi ke dashboard---design---add a gadget---html / javascript...

copy salah 1 code yang anda mau.. kemudian paste...

Gantikan tulisan Code Banner dengan code banner blog yang anda berminat...

Code banner boleh di dapati di blog yang ada banner sahaja.. hehehe.. ('',)

Updated : Banner akan berhenti bergerak jika anda letak mouse pada banner..

Sekian