Donation & Follower Notification

[Birksy87]

Hi, I was hoping someone could set up these gifs for me as my follower notification and donation notification.

Follower notification:
This gif with the follower name below that flashes (or some kind of effect I'm not too fussy)
http://giphy.com/gifs/reaction-gsYKROakiJQPu

Donation notification:
This gif with the donation name, amount and message if possible again something flashy but not too fussed
http://giphy.com/gifs/TCaq4FekwSV5m

Thank you for all your efforts.

- Birksy87

[TheNumbLock]

Requested by: Birksy87

Follower:

Link: http://deepbot.tv/notifications/follownotification1.htm
Width: 1280
Height: 720

CSS Code:

Code: [Select]

#follow-notification {
display: none;
position: absolute;
width: 512px !important;
height: 288px !important;
background-image: url('http://i.imgur.com/NcgT7Ol.gif') !important;
background-repeat: no-repeat;
}

#follow-notification .followname {
position: absolute !important;
margin-top: 200px !important;
margin-left: 50px !important;
width: 400px !important;
font-size: 34px !important;
font-weight: normal !important;
font-family: Impact !important;
color: blue !important;
-webkit-text-fill-color: red;
-webkit-text-stroke-color: black;
-webkit-text-stroke-width: 1.5px;
}

Preview: (If there is a black background, it is just my background.)




Donation:

Link: http://deepbot.tv/notifications/donationnotification2.htm
Width: 718
Height: 450

CSS Code:

Code: [Select]

#donor-notification {
width: 512px !important;
height: 288px !important;
background-color: transparent !important;
background-image:url('http://i.imgur.com/vTfUukn.gif') !important;
background-repeat: no-repeat !important;
background-size: initial !important;
}
 
#donor-notification .header {
visibility: hidden !important;
}
 
#donor-notification .streamname {
visibility: hidden !important;
}
 
#donor-notification .message {
position: absolute !important;
margin-top: 285px !important;
margin-left: 10px !important;
width: 500px !important;
font-size: 22px !important;
font-weight: normal !important;
font-family: Impact !important;
color: blue !important;
text-shadow: 2px 2px black;
-webkit-text-fill-color: red;
-webkit-text-stroke-color: black;
-webkit-text-stroke-width: 1.5px;
}
#donor-notification .amount {
position: absolute !important;
margin-top: 0px !important;
margin-left: -50px !important;
font-size: 30px !important;
font-weight: normal !important;
font-family: Impact !important;
color: blue !important;
text-shadow: 2px 2px black;
-webkit-text-fill-color: red;
-webkit-text-stroke-color: black;
-webkit-text-stroke-width: 1.5px;
}
#donor-notification .donor {
position: absolute !important;
margin-top: 0px !important;
margin-left: -230px !important;
width: 500px !important;
font-size: 30px !important;
font-weight: normal !important;
font-family: Impact !important;
color: blue !important;
text-transform: capitalize;
text-shadow: 2px 2px black;
-webkit-text-fill-color: red;
-webkit-text-stroke-color: black;
-webkit-text-stroke-width: 1.5px;
}

Preview: (If there is a black background, it is just my background.)

[Birksy87]

Hi Repent,

Thanks for making those for me man I really appreciate it.

Would you be able to amend the image for me, I didn't realise I needed to size them appropriately to avoid the side and bottom scroll bars appearing on the pic. New links are below.

Follow notification.
http://i.imgur.com/NcgT7Ol.gif

Donation notification.
http://i.imgur.com/vTfUukn.gif

Thanks as always for your help with this.

- Birksy87

[TheNumbLock]

Hi Repent,

Thanks for making those for me man I really appreciate it.

Would you be able to amend the image for me, I didn't realise I needed to size them appropriately to avoid the side and bottom scroll bars appearing on the pic. New links are below.

Follow notification.
http://i.imgur.com/NcgT7Ol.gif

Donation notification.
http://i.imgur.com/vTfUukn.gif

Thanks as always for your help with this.

- Birksy87

Updated the post above yours.

[Birksy87]

Hi Repent,

Thanks for that. The follower one is working perfect but the donation one comes up with side and bottom scroll bars. Not sure why?

Can you take a look at that?

Thanks again Repent.

[TheNumbLock]

Just adjust the dimensions on the general tab of the CLR Browser. Try increasing by like 50 or 100 on each till they are gone.

The dimensions I used for yours: