Limited-Time Donation Special!
Upgrade to Snow for $20 USD and receive a free copy of Oblivion Light ($5 discount).
Upgrade to +Blizzard for $35 USD and receive a free copy of Oblivion Light ($15 discount).

Please visit the thread below for more details.
CLICK HERE

Contact @Davlin with questions or comments.

Jump to content
PsYcHo_RaGE

How to Create a Sparkbow

Recommended Posts

Posted (edited)

In this tutorial i am gonna show you how to create a sparkbow, basically its a mixture of two effects viz Sparkling and rainbow > Sparkbow

let's get started > first of all go to AdminCP and login Opera_Snapshot_2018_08_08_154938.png then go to Opera_Snapshot_2018_08_08_155314.png

>Customization>Themes>121a628666e06ab839ce71da062d25b2.gif

like the images above, do the same thing >

now go to global template which is shown by default so paste The below piece of code towards the bottom of the script. For example, you could place it just above where you see something relevant to <!-- ::: Footer ::: -->

Opera_Snapshot_2018_08_08_161452.png

<script>
var speed=80
var hex=new Array("00","14","28","3C","50","64","78","8C","A0","B4","C8","DC","F0")
var r=1
var g=1
var b=1
var seq=1
function changetext(){
for(i=0;i<document.getElementsByName("Rainbow").length;i++){
var storetext=document.getElementById? document.getElementsByName("Rainbow")[i] : document.all.highlight
rainbow="#"+hex[r]+hex[g]+hex[b]
storetext.style.color=rainbow
}
}
function change(){
if (seq==6){
b--
if (b==0)
seq=1
}
if (seq==5){
r++
if (r==12)
seq=6
}
if (seq==4){
g--
if (g==0)
seq=5
}
if (seq==3){
b++
if (b==12)
seq=4
}
if (seq==2){
r--
if (r==0)
seq=3
}
if (seq==1){
g++
if (g==12)
seq=2
}
changetext()
}
function starteffect(){
if (document.all||document.getElementById)
flash=setInterval("change()",speed)
}
starteffect()
</script>

After you have inserted the code, within [edit html & css] go to CSS Tab and click on custom.css (if you are not able to find it, Search it!) now in custom.css paste the following code

Opera_Snapshot_2018_08_08_161546.png

/* Membership Color Group /Color is in hex /change anything you want and suit your needs/ i have included only two groups here, you can incude as many as you want */
.Youranygroup {
background: url(link to sparkle gif);
color: #00fffa;
font-weight: bold;
text-shadow: 2px 0px 11px #00ffe5;
}

.Youranygroup {
background: url(link to sparkle gif);
color: #f93647;
font-weight: bold;
text-shadow: 2px 0px 11px #f93647;
}

Opera_Snapshot_2018_08_08_162453.png

 

Now, we will navigate from within the AdminCP to Members > Member Groups > Manage Member Groups > Click on the group you wish to have the sparkbow effect

For the group prefix, you are going to enter the following code

<span name="Rainbow" class="youranygroup">

As for the group suffix, you are going to enter

</span>

And you are done, now surf up the website and see that changes made//////// if you are still getting any problem..i am here to help you

Conclusion

Sparkbow.gif.871df3962bfbae5a4da8facfd41d314b.gif

Edited by PsYcHo_RaGE
  • Like 2

Share this post


Link to post
Share on other sites

Would suggest add a small preview of what it is (for people this is just pure code)

Also i optimized your code a bit, as your self executing things all the time. using else if should speed up the time it takes for JS to check if its truthy or falsy.

also the JS can be optimized even further as this seems a bit sloppy written imo other then that great guide.

function change() {
	if (seq == 6) {
		b--;
		if (b == 0) seq = 1;
	} else if (seq == 5) {
		r++;
		if (r == 12) seq = 6;
	} else if (seq == 4) {
		g--;
		if (g == 0) seq = 5;
	} else if (seq == 3) {
		b++;
		if (b == 12) seq = 4;
	} else if (seq == 2) {
		r--;
		if (r == 0) seq = 3;
	} else if (seq == 1) {
		g++;
		if (g == 12) seq = 2;
	}
	changetext();
}

 

  • Like 1
  • Thanks 1

Share this post


Link to post
Share on other sites
Posted (edited)
26 minutes ago, Cookie Monster said:

Would suggest add a small preview of what it is (for people this is just pure code)

Also i optimized your code a bit, as your self executing things all the time. using else if should speed up the time it takes for JS to check if its truthy or falsy.

also the JS can be optimized even further as this seems a bit sloppy written imo other then that great guide.

function change() {
	if (seq == 6) {
		b--;
		if (b == 0) seq = 1;
	} else if (seq == 5) {
		r++;
		if (r == 12) seq = 6;
	} else if (seq == 4) {
		g--;
		if (g == 0) seq = 5;
	} else if (seq == 3) {
		b++;
		if (b == 12) seq = 4;
	} else if (seq == 2) {
		r--;
		if (r == 0) seq = 3;
	} else if (seq == 1) {
		g++;
		if (g == 12) seq = 2;
	}
	changetext();
}

 

well i forgot to add preview but its now inserted 

and thanks for optimizing the code, greatly appreciated your help

and i also i will try to to make it more stable and will update it continuously 

Edited by PsYcHo_RaGE
  • Like 1

Share this post


Link to post
Share on other sites
6 hours ago, kLeiNtjiEE said:

Thank you very much, it looks very good

did you tried it? if you are getting any problems i am here and thanks for trying it

Share this post


Link to post
Share on other sites

This looks clean... will look to integrate it and let you know how i get on :) 

Share this post


Link to post
Share on other sites
What do you think? Remember the human.

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

  • Recently Browsing   0 members

    No registered users viewing this page.

×