CuteRebellion

Thursday, May 24, 2018

Sparkling ( Cursor Effect )

Hello guys! want some effect's on your cursor? like something sparkling! then this tutorial is for you, if your like me that want some effect's on blog or cursor just follow this tutorial. xoxo

NOTE: I didn't own this, Credits to the owner. Feel free to use this tutorial. ^^

FOR TEMPLATE DESIGNER :

Get into your Blogger dashboard and go to Layout.
Open a new HTML/Javascript Gadget in your sidebar.
Copy the code below.

/****************************
*  Tinkerbell Magic Sparkle *
*(c)2005-13 mf2fm web-design*
*  http://www.mf2fm.com/rv  *
* DON'T EDIT BELOW THIS BOX *
****************************/
var x=ox=400;
var y=oy=300;
var swide=800;
var shigh=600;
var sleft=sdown=0;
var tiny=new Array();
var star=new Array();
var starv=new Array();
var starx=new Array();
var stary=new Array();
var tinyx=new Array();
var tinyy=new Array();
var tinyv=new Array();

document.onmousemove=mouse;
function mouse(e) {
  if (e) {
    y=e.pageY;
    x=e.pageX;
  }
  else {
    set_scroll();
    y=event.y+sdown;
    x=event.x+sleft;
  }
}

function createDiv(height, width) {
  var div=document.createElement("div");
  div.style.position="absolute";
  div.style.height=height+"px";
  div.style.width=width+"px";
  div.style.overflow="hidden";
  return (div);
}

function newColour() {
  var c=new Array();
  c[0]=255;
  c[1]=Math.floor(Math.random()*256);
  c[2]=Math.floor(Math.random()*(256-c[1]/2));
  c.sort(function(){return (0.5 - Math.random());});
  return ("rgb("+c[0]+", "+c[1]+", "+c[2]+")");
}
// ]]>
</script>

> Paste the code in the empty HTML/Javascript box.
> You can change the color find this code var colour="#f0f";

FOR BLOG-SKINS :

Copy the code below,
And paste it between the <head> and </head> tags at the top of your web-page.

document.onmousemove=mouse;
function mouse(e) {
  if (e) {
    y=e.pageY;
    x=e.pageX;
  }
  else {
    set_scroll();
    y=event.y+sdown;
    x=event.x+sleft;
  }
}

NOTE: If you want to change the color of the border of the bubbles or the background, change the color at the start of the script you just copied or find this code var colour="#f0f"; to the settings you require.

PREVIEW AND SAVE

That's it, when your page loads and when you move your cursor, magic sparkles (or fairy dust, whichever you prefer) appear, just like Tinkerbell in Peter Pan!

Thank you for using my tutorial's ^^ Leave a comment here ! so i can re-visit you!

Wednesday, May 23, 2018

Bubble ( Cursor Effect )

CuteRebellion 11:52 PM 0 Comments

Hello guys! Want some effect's on your cursor ?, your wish is my command so here it is.
Bubble effect on cursor. Enjoy !

NOTE: I didn't own this credits to the owner. Feel free to use this tutorial ^^

FOR TEMPLATE DESIGNER :

Get into your Blogger dashboard and go to Layout.
Open a new HTML/Javascript Gadget in your sidebar.
Copy the code below.

/****************************
* JavaScript Bubble Cursor  *
*(c)2010-13 mf2fm web-design*
*  http://www.mf2fm.com/rv  *
* DON'T EDIT BELOW THIS BOX *
****************************/
var x=ox=400;
var y=oy=300;
var swide=800;
var shigh=600;
var sleft=sdown=0;
var bubb=new Array();
var bubbx=new Array();
var bubby=new Array();
var bubbs=new Array();
var sploosh=false;

function addLoadEvent(funky) {
  var oldonload=window.onload;
  if (typeof(oldonload)!='function') window.onload=funky;
  else window.onload=function() {
    if (oldonload) oldonload();
    funky();
  }
}

addLoadEvent(buble);

function buble() { if (document.getElementById) {
  var i, rats, div;
  for (i=0; i<bubbles; i++) {
    rats=createDiv("3px", "3px");
    rats.style.visibility="hidden";
 rats.style.zIndex=(over_or_under=="over")?"1001":"0";

div=createDiv("auto", "auto");
    rats.appendChild(div);
    div=div.style;
    div.top="1px";
    div.left="0px";
    div.bottom="1px";
    div.right="0px";
    div.borderLeft="1px solid "+colours[3];
    div.borderRight="1px solid "+colours[1];

div=createDiv("auto", "auto");
    rats.appendChild(div);
    div=div.style;
    div.top="0px";
    div.left="1px";
    div.right="1px";
    div.bottom="0px"
    div.borderTop="1px solid "+colours[0];
    div.borderBottom="1px solid "+colours[2];

div=createDiv("auto", "auto");
    rats.appendChild(div);
    div=div.style;
    div.left="1px";
    div.right="1px";
    div.bottom="1px";
    div.top="1px";
    div.backgroundColor=colours[4];
    if (navigator.appName=="Microsoft Internet Explorer") div.filter="alpha(opacity=50)";
    else div.opacity=0.5;
    document.body.appendChild(rats);
    bubb[i]=rats.style;
  }
  set_scroll();
  set_width();
  bubble();
}}

document.onmousedown=splash;
document.onmouseup=function(){clearTimeout(sploosh);};

function splash() {
  ox=-1;
  oy=-1;
  sploosh=setTimeout('splash()', 100);
}

document.onmousemove=mouse;
function mouse(e) {
  if (e) {
    y=e.pageY;
    x=e.pageX;
  }
  else {
    set_scroll();
    y=event.y+sdown;
    x=event.x+sleft;
  }
}

function createDiv(height, width) {
  var div=document.createElement("div");
  div.style.position="absolute";
  div.style.height=height;
  div.style.width=width;
  div.style.overflow="hidden";
  div.style.backgroundColor="transparent";
  return (div);
}
// ]]>
</script>

> Paste the code in the empty HTML/Javascript box.

FOR BLOG-SKINS :

Copy the code below
And paste it between the <head> and </head> tag's.

addLoadEvent(buble);

document.onmousedown=splash;
document.onmouseup=function(){clearTimeout(sploosh);};

function splash() {
  ox=-1;
  oy=-1;
  sploosh=setTimeout('splash()', 100);
}

document.onmousemove=mouse;
function mouse(e) {
  if (e) {
    y=e.pageY;
    x=e.pageX;
  }
  else {
    set_scroll();
    y=event.y+sdown;
    x=event.x+sleft;
  }
}

NOTE: If you want to change the color of the border of the bubbles or the background, change the color at the start of the script you just copied to the settings you require.

PREVIEW AND SAVE

That's it when your page loads your cursor will be swimming along underwater producing bubbles as it does so: glub, glub, glub! Also, if you hold the mouse button down, more bubbles will appear.

Thank you for using my tutorial's ^^ Leave a comment here ! so i can re-visit you!

Bubble Bath ( Blog Effect )

CuteRebellion 11:35 PM 0 Comments

Hello guys ! yes! I'm not busy ! so guys want some effects on your blog !? here it is, some Bubble bath effect in your blog Enjoy !

NOTE: I didn't own this credits to the owner. Feel free to use this tutorial. ^^

FOR TEMPLATE DESIGNER :

> Get into your Blogger dashboard and go to Layout.
> Open a new HTML/Javascript Gadget in your sidebar.
> Copy this code
.

/****************************
*   JavaScript Bubble Bath  *
*(c)2010-13 mf2fm web-design*
*  http://www.mf2fm.com/rv  *
* DON'T EDIT BELOW THIS BOX *
****************************/

var swide=800;
var shigh=600;
var bubb=new Array();
var bubbx=new Array();
var bubby=new Array();
var bubbs=new Array();
var boddie;
var ie_version=(navigator.appVersion.indexOf("MSIE")!=-1)?parseFloat(navigator.appVersion.split("MSIE")[1]):false;

addLoadEvent(bubba);

function bubba() { if (document.getElementById) {
  var i, rats, div;
  boddie=document.createElement("div");
  boddie.style.position="fixed";
  boddie.style.top="0px";
  boddie.style.left="0px";
  boddie.style.overflow="visible";
  boddie.style.width="1px";
  boddie.style.height="1px";
  boddie.style.backgroundColor="transparent";
  boddie.style.zIndex="0";
  document.body.appendChild(boddie);
  set_width();
  for (i=0; i<bubbles; i++) {
    rats=createDiv("3px", "3px");

div=createDiv("auto", "auto");
    rats.appendChild(div);
 div=div.style;
    div.top="1px";
    div.left="0px";
 div.bottom="1px";
 div.right="0px";
 div.borderLeft="1px solid "+colours[3];
 div.borderRight="1px solid "+colours[1];

div=createDiv("auto", "auto");
 rats.appendChild(div);
 div=div.style;
    div.top="0px";
    div.left="1px";
 div.right="1px";
 div.bottom="0px"
 div.borderTop="1px solid "+colours[0];
 div.borderBottom="1px solid "+colours[2];

boddie.appendChild(rats);
 bubb[i]=rats.style;
 bubb[i].zIndex=(over_or_under=="over")?"1001":"0";
  }
  bubble();
}}

function bubble() {
  var c;
  for (c=0; c<bubbles; c++) if (!bubby[c] && Math.random()<0.333) {
    bubb[c].left=(bubbx[c]=Math.floor(swide/6+Math.random()*swide/1.5)-10)+"px";
    bubb[c].top=(bubby[c]=shigh)+"px";
    bubb[c].width="3px";
 bubb[c].height="3px"
 bubb[c].visibility="visible";
 bubbs[c]=3;
    break;
  }
  for (c=0; c<bubbles; c++) if (bubby[c]) update_bubb(c);
  setTimeout("bubble()", 40);
}

> Paste the code in the empty HTML/Javascript box.
> If you want to change the color. Go to this site.

And change the underlined part.

FOR BLOG-SKINS :

> Copy the code below,
> And paste it between the <head> and </head> tags at the top of your web-page:

/****************************
*   JavaScript Bubble Bath  *
*(c)2010-13 mf2fm web-design*
*  http://www.mf2fm.com/rv  *
* DON'T EDIT BELOW THIS BOX *
****************************/

addLoadEvent(bubba);

div=createDiv("auto", "auto");
    rats.appendChild(div);
 div=div.style;
    div.top="1px";
    div.left="0px";
 div.bottom="1px";
 div.right="0px";
 div.borderLeft="1px solid "+colours[3];
 div.borderRight="1px solid "+colours[1];

div=createDiv("auto", "auto");
 rats.appendChild(div);
 div=div.style;
    div.top="0px";
    div.left="1px";
 div.right="1px";
 div.bottom="0px"
 div.borderTop="1px solid "+colours[0];
 div.borderBottom="1px solid "+colours[2];

boddie.appendChild(rats);
 bubb[i]=rats.style;
 bubb[i].zIndex=(over_or_under=="over")?"1001":"0";
  }
  bubble();
}}

PREVIEW AND SAVE

That's it When your page loads your bubble bath should begin, leaving you with a warm, effective scent Jacuzzi-like feeling and reaching out for a glass of bubbly and some soft-glow candles! Or maybe this script could be use to animate a fish tank or glass of beer, or an undersea picture - the uses are pointless, I mean endless.

Thank you for using my tutorial's ^^ Leave a comment here ! so i can re-visit you!

Fireworks ( Blog Effect )

CuteRebellion 2:16 PM 0 Comments

Hello guys! Want some effect's on your blog, your wish is my command so here it is. Enjoy !

NOTE : I didn't own this, credits to the owner. Feel free to use it.

FOR TEMPLATE DESIGNER :

> Get into your Blogger dashboard and go to Layout.

> Open a new HTML/Javascript Gadget in your sidebar.

>Copy the code below..

> Paste the code in the empty HTML/Javascript box.

FOR BLOG SKINS :

> Copy and paste the code below
> Find this code </head>
> And Paste it before </head>

/****************************
*      Fireworks Effect     *
*(c)2004-14 mf2fm web-design*
*  http://www.mf2fm.com/rv  *
* DON'T EDIT BELOW THIS BOX *
****************************/
var bangheight=new Array();
var intensity=new Array();
var colour=new Array();
var Xpos=new Array();
var Ypos=new Array();
var dX=new Array();
var dY=new Array();
var stars=new Array();
var decay=new Array();
var swide=800;
var shigh=600;
var boddie;

if (typeof('addRVLoadEvent')!='function') function addRVLoadEvent(funky) {
  var oldonload=window.onload;
  if (typeof(oldonload)!='function') window.onload=funky;
  else window.onload=function() {
    if (oldonload) oldonload();
    funky();
  }
}

addRVLoadEvent(light_blue_touchpaper);

function write_fire(N) {
  var i, rlef, rdow;
  stars[N+'r']=createDiv('|', 12);
  boddie.appendChild(stars[N+'r']);
  for (i=bits*N; i<bits+bits*N; i++) {
    stars[i]=createDiv('*', 13);
    boddie.appendChild(stars[i]);
  }
}

function createDiv(char, size) {
  var div=document.createElement("div");
  div.style.font=size+"px monospace";
  div.style.position="absolute";
  div.style.backgroundColor="transparent";
  div.appendChild(document.createTextNode(char));
  return (div);
}

function launch(N) {
  colour[N]=Math.floor(Math.random()*colours.length);
  Xpos[N+"r"]=swide*0.5;
  Ypos[N+"r"]=shigh-5;
  bangheight[N]=Math.round((0.5+Math.random())*shigh*0.4);
  dX[N+"r"]=(Math.random()-0.5)*swide/bangheight[N];
  if (dX[N+"r"]>1.25) stars[N+"r"].firstChild.nodeValue="/";
  else if (dX[N+"r"]<-1.25) stars[N+"r"].firstChild.nodeValue="\\";
  else stars[N+"r"].firstChild.nodeValue="|";
  stars[N+"r"].style.color=colours[colour[N]];
}

function bang(N) {
  var i, Z, A=0;
  for (i=bits*N; i<bits+bits*N; i++) { 
    Z=stars[i].style;
    Z.left=Xpos[i]+"px";
    Z.top=Ypos[i]+"px";
    if (decay[i]) decay[i]--;
    else A++;
    if (decay[i]==15) Z.fontSize="7px";
    else if (decay[i]==7) Z.fontSize="2px";
    else if (decay[i]==1) Z.visibility="hidden";
 if (decay[i]>1 && Math.random()<.1) {
    Z.visibility="hidden";
    setTimeout('stars['+i+'].style.visibility="visible"', speed-1);
 }
    Xpos[i]+=dX[i];
    Ypos[i]+=(dY[i]+=1.25/intensity[N]);

}
  if (A!=bits) setTimeout("bang("+N+")", speed);
}

> If you want to change the color of the border of the bubbles or the background, change the color

at the start of the script you just copied to the settings you require.

var colours=new Array("#03f", "#f03", "#0e0", "#93f", "#0cf", "#f93", "#f0c");
// blue red green purple cyan orange pink

> PREVIEW AND SAVE.

THAT'S IT When your page loads, the fireworks should begin to explode on the screen.

Thank you for using my tutorial's ^^ Leave a comment here ! so i can re-visit you!

Random Background

CuteRebellion 12:42 PM 0 Comments

Enjoy with this Random Background's !

READ THIS:
The Background's that are posted here are not mine unless stated otherwise. The background's are from different blogs.

You can use this Backgrounds. Right Click on the image and copy the IMG URL

Thank you for using my tutorial's ^^ Leave a comment here ! so i can re-visit you!

Music Player

CuteRebellion 12:32 PM 0 Comments

There are 2 music players that i like to use in my blog. Choose from any of these two that you'd like to use. But first, I’ll teach you how to get the music that you want first!

FIRST : How to get the direct link of the music:

> Go to http://kiwi6.com - create an account
( You can connect your Facebook account if you want )
> Go to Artist tools - Upload - You can select if you want to upload music from your computer or convert a YouTube video to mp3.

YouTube Example Link : http://www.youtube.com/watch?v=9ySlbKxtpio>

After uploading, you will see two links ( Name and Saved as ).

> Click any of the two then you will see a Share Link and Direct Link. Copy the Direct Link.

Now that we have the music ready, you can choose from these two players: Billy Music Player or Flash MP3 Player.

Billy Music Player:

Paste the direct link of the music you have uploaded then put the title of the song on the right side. You can put 5 songs if you like. Click Generate Code. Copy the code and paste it on your blog. You can put it on your about me section or anywhere you like.

Flash MP3 Player:

Choose the Mini size of player. On the right side, look for Generator then click. Paste the Direct Link on the mp3 section. If you want the player to play once the visitor opens your blog, choose 1 then if you don’t, choose 0. Copy the code and paste it on your blog.

You can also change the color by changing the value of the bgcolor from #000000 to any color that you want.

Example: name=”bgcolor“ value=”#ffffff” />

Additional codes:

You can add these after the value of the Flash vars

&bgcolor=ffffff&loadingcolor=b5b5b5&buttoncolor=0d0d0d& slidercolor=ff57a3

Example: buttoncolor=0d0d0d& slidercolor=ff57a3” />

You can change the color to any color that you want. I hope these tutorials helped you.
thank you !

Tutorials © Cutesecrets

Thank you for using my tutorial's ^^ Leave a comment here ! so i can re-visit you!

Thursday, May 24, 2018

Sparkling ( Cursor Effect )

Wednesday, May 23, 2018

Bubble ( Cursor Effect )

Bubble Bath ( Blog Effect )

Fireworks ( Blog Effect )

Random Background

Music Player

☆ My World ☆

✧ Follow Me ✧

✧ My Friend's ✧

Popular

Archive

Labels

Advertise Here

Tags

Popular Posts

Categories