[CM] Username Blink - On Mouse Hover vB4.x

[ChiNa]

This was Requested by a member on our forum vBulletin-Mods..! This is a simple Modification! Now this is another Trick by hovering your mouse over a username, and it will have Blinks on it! Because the GIFs are used as a background image...

Notice: The code is made by myself, while the Images can be found online! Therefor you can freely re-use the code from my side!

Here are all 4 Animated Gif Blinks/Images:

Gray Blink: https://vborg.vbsupport.ru/external/2012/11/11.gif
Green Blink: https://vborg.vbsupport.ru/external/2012/11/12.gif
Red Blink: https://vborg.vbsupport.ru/external/2012/11/13.gif
Aqua Blink: https://vborg.vbsupport.ru/external/2012/11/14.gif

1) First of all, Downlod all the 4 Animated Gifs that I have attached below in the ZIP file called "Blinks.zip" or simply RIGHT click and copy them to your computer from the top.. Now after downloading the images, Upload them all to your forums "images" Folder!

2) Go to your ADMINCP >> and then in your Style Manager (Style & Templates) >> section, click on the DROPDOWN to its right, and click on Edit Templates >> Now look for CSS Templates and click to enter. Now choose the Additional.css Template.

3) Add the following Code below everything else in your Additional.css Template:

Add This Code Below all the way below:
.blink1:hover {
background: URL("images/blink1.gif");
}
.blink2:hover {
background: URL("images/blink2.gif");
}
.blink3:hover {
background: URL("images/blink2.gif");
}
.blink4:hover {
background: URL("images/blink4.gif");
}
What you just added is 3 Different "Animated GIF" wich blinks to your CSS Template! Now we are ready to assign them to EACH USERGROUP, And I will assign them 1 by 1 to 3 different USERGROUPS! But showing you only 1 TIME, you have to do the rest.

4) Now if you have Uploaded the 4 GIF IMAGES which is inside the "Blinks.zip" file folder go to next step! The images are important to upload first!

5) Now Its upto you which BLINK COLOR you want to assign, and to which group!

Go to your ADMINCP, and then find USEGROUP that you wanna assign a blinking image too.. Lets stay we choose
the Administrator Group!

Click on the Administrator group! Now if you look on the new page, you will see: Title, Description, User Title and Username HTML Markup..

We need the "Username HTML Markup"! Notice that there are 2 FIELDS there.... And we have to add
our code in both FIELDS! I will call the first field for "FIELD 1" and the other for "FIELD 2"!

Add the following code in first field (Field 1):
<span class="blink1">

And add this code in "SECOND" field (Field 2):
</span>

Thats it............ We are done.

One more thing, if you wanted to have "BIG" letters assigned to each usergroup, then add the following code in the front of the other codes
we just added...

Add the following code in FIELD 1, at the VERY START:
<b>

Add the second code in FIELD 2:
</b>

So together it should look like this:
Field 1: <b><span class="blink1">
Field 2: </b></span>

NOW WE ARE OFFICIALY DONE!

One Last Thing: Remember that we added 3 Different BLINKS, you have 3 more to go! So do the same thing in the NEXT Usergoup, but remember instead of <span class="blink1"> you change the text called "blink1" to "blink2" or "blink3"! If you wanted

And if you wanted to add more than 4 blinks, Then go to your "Aditional.css" template again, and add the next code with 10 BLINKS!

10 different Codes:

.blink1:hover {
background: URL("images/blink1.gif");
}
.blink2:hover {
background: URL("images/blink2.gif");
}
.blink3:hover {
background: URL("images/blink3.gif");
}
.blink4:hover {
background: URL("images/blink4.gif");
}
.blink5:hover {
background: URL("images/blink5.gif");
}
.blink6:hover {
background: URL("images/blink6.gif");
}
.blink7:hover {
background: URL("images/blink7.gif");
}
.blink8:hover {
background: URL("images/blink8.gif");
}
.blink9:hover {
background: URL("images/blink9.gif");
}
.blink0:hover {
background: URL("images/blink0.gif");
}
There are 10 DIFFERENT BLINKS, after adding the code to your ADDITIONAL.CSS, make sure to add the IMAGES also to your forums IMAGES folder!

Update: Images & Blinks Added Directly on TOP : 1 New Blink added

Notice: You can add your own Images as well, these are the ones I already had using in my own forum!

[ozzy47]

Hey ChiNa-Man is the title of the mod supposed to say vB3.8 even though you have it listed as vB Version: 4.2.0?

[ibrahimkoky]

thanks- Tagged

[ChiNa]

Hey ChiNa-Man is the title of the mod supposed to say vB3.8 even though you have it listed as vB Version: 4.2.0?

My bad, I have posted this MOD on vB3.8 forums too, an used the same title here as well... Thanks for notice !

[tanzeelniazi]

Really great Let me check thanks

[Cusski]

working perfect on vb4.2 pl3, should not field 2 be

</span>

and not

<span>

as showen?

Our forum has already some code in these fields, but it can be added like this

Field1

<span style="font-weight: bold; color: red;"><span class="blink1">

Field2

</span>

and works perfect :)

[ozzy47]

My bad, I have posted this MOD on vB3.8 forums too, an used the same title here as well... Thanks for notice !

I figured it was a copy/paste thing. ;)

[ChiNa]

@Cusski.... Hi, Thank u for the notice! Its because I have copied and pasted the same thread on 4 other sites, and I been editing a lot, Totally forgot that part! Appreciate your notice!

[tanzeelniazi]

I cant success :( help please
My HTML code is:
<img src='images/sooweb/icons/King.png'><span style='font-weight: bold; color:Red;'>
</span>
how i use this <span class="blink1">
and i am using also HTML Markup hack

[sodasusu]

not show in forumhome

like this http://forum.ampm.co.id/forum.php

[MentaL]

These are mine :(

[ozzy47]

These are mine :(

What are yours?

[ChiNa]

These are mine :(

You better come up with something better to accuse another Developer on vBForums.org! Thats a real shame! One thing I hate most is accussations which is bringing my blood to boil. And on the other hand you are not really normal to come and accuse someone for blinks made 12 years ago for Myspace.

[TheLastSuperman]

Hey ChiNa-Man is the title of the mod supposed to say vB3.8 even though you have it listed as vB Version: 4.2.0?

My bad, I have posted this MOD on vB3.8 forums too, an used the same title here as well... Thanks for notice !

Actually you can post the same identical code in 3.6, and 3.7 forums and it would be allowed. Sadly not all know that some older 3.x mods work fine on 4.x (https://vborg.vbsupport.ru/showthread.php?t=269719) and even back then before 4.x not many owners realized most 3.5/3.6/3.7 mods would work just fine on 3.8 etc etc so you're perfectly allowed to post duplicate mods per say some choose not too but then again there are the owners that will not know unless it specifically states that it is for use with their specific version.

Ozzy asked that because he wanted it in the right location, I answered slightly off-topic so some would also come to realize that posting duplicates is allowed considering thereby covering all bases lol ;).

These are mine :(

See below...

You better come up with something better to accuse another Developer on vBForums.org! Thats a real shame! One thing I hate most is accussations which is bringing my blood to boil. And on the other hand you are not really normal to come and accuse someone for blinks made 12 years ago for Myspace.

Actually the concept is the same the the images, how the code is implemented and more is entirely different.

MentaL please compare carefully next time before stating such, your opinion being posted is fine but when you're not taking the time to compare and say such things well as CM posted it tends to make blood boil :p.

Regardless each mod is different and serves the purpose just fine so no worries all around!

[MentaL]

i personally recolored a lot of the 'blinks' myself numerous years ago... that's how i know. My Forum. (http://forum.ragezone.com) Heck, even searching vb.org brings mine hyperlinked from years ago too.

Happy 2014.

[tanzeelniazi]

Bumpp any one help me please Post 9

[TheLastSuperman]

i personally recolored a lot of the 'blinks' myself numerous years ago... that's how i know. My Forum. (http://forum.ragezone.com) Heck, even searching vb.org brings mine hyperlinked from years ago too.

Happy 2014.

So it was the images then? I assumed you meant the mod overall, if you view the info on each it's all clearly different. If you have proof of this please submit but before warned that you and I both know there are so many "royalty free" type of image sites he might have happened across these that someone else uploaded for free use which were not, I'm not saying that's the case just trying to provide benefit of doubt here to both sides.

The way I looked at it, and want you to understand is from overall mod to mod implementation and coding, each was simple both being template edits and such so no complex modification file was present on each with "identical code" being used i.e. "Ohh look at that it's exactly the same including $variable names so it's clearly a rip-off" therefor I thought everything was good to go here.

*I also deleted some replies, you two be nice lol and Ozzy I deleted one of yours as it quoted them both just a friendly "Hey this is why I did this gents" etc etc, I did not feel the need to pm you all instead I simply stated so here ;). **One more thing, I see some of you are sending pm's over disputes... I would dare say if you're not getting along publicly then it might be in the best interest of both parties to not send pm's to one another, just my 2 cents to avoid future frustration and reports if any are submitted due to uncalled for behavior in pm's.

[blackberry]

I cant success :( help please
My HTML code is:
<img src='images/sooweb/icons/King.png'><span style='font-weight: bold; color:Red;'></span>how i use this <span class="blink1">
and i am using also HTML Markup hack
add another span as he said and it should work.

[tanzeelniazi]

but how please can you put example