Follow, Subscriber and Donation!

[zaitr0s]

Hey, can you help me with my popup notification?

Follow pic: http://imgur.com/NaKXvln
I want the text in the middle of the blackbar.

Subscriber pic: http://imgur.com/AAXcVXH
I want the same here as the follow pic. The text need to be in the middle of the blackbar.

Donation pic: http://imgur.com/2usJC1D
Here i want a diffrend text, I want the name and the value come ups in the blackbar so it fade in and out. then the message coming and the message need to scroll slow to the left. thats all i need to have.

I hope you understand. I text you if you dont understand.

[TheNumbLock]

I won't be able to do this till Saturday evening, currently on vacation, but will do it once I am back.

[zaitr0s]

Okeej, np mate.

[TheNumbLock]

I won't be able to scroll the message. :/ But I may be able to make it fade, and appear in the box I suppose. But ya. Up to you.

Requested by: zaitr0s

Follower:

Link: http://deepbot.tv/notifications/follownotification1.htm
Width: 600
Height: 150

CSS Code:

Code: [Select]


#follow-notification {
display: none;
position: absolute;
width: 580px !important;
height: 110px !important;
border-radius: 00px !important;
background-image: url('http://i.imgur.com/NaKXvln.png') !important;
background-repeat: no-repeat;
}
#follow-notification .followname {
position: absolute !important;
text-align: center !important;
margin-top: 30px !important;
margin-left: 130px !important;
margin-right: 100px !important;
width: 300px !important;
font-size: 28px !important;
font-weight: normal !important;
font-family: CF Crack and Bold !important;
color: white !important;
}


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



Subscriber:

Link: http://deepbot.tv/notifications/subnotification1.htm
Width: 580
Height: 150

CSS Code:

Code: [Select]

#sub-notification {
  display: none;
  position: absolute;
  width: 580px !important;
  height: 110px !important;
  background-repeat: no-repeat;
  background-image: url('http://i.imgur.com/AAXcVXH.png') !important;
}
#sub-notification .subname {
position: absolute !important;
text-align: left !important;
margin-top: -110px !important;
margin-left: 200px !important;
width: 300px !important;
font-size: 28px !important;
font-weight: bold !important;
font-family: CF Crack and Bold !important;
color: white !important;
}

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



Donation:

Link: http://deepbot.tv/notifications/donationnotification2.htm
Width: 600
Height: 250

CSS Code:

Code: [Select]

#donor-notification {
width: 600px !important;
height: 200px !important;
background-color: transparent !important;
background-image:url('http://i.imgur.com/2usJC1D.png') !important;
background-repeat: no-repeat !important;
background-size: initial !important;
}


#donor-notification .header {
position: absolute !important;
visibility: hidden !important;
}

#donor-notification .streamname {
visibility: hidden !important;
}

#donor-notification .message {
visibility: hidden !important;
}
#donor-notification .amount {
position: absolute !important;
text-align: center !important;
margin-top: 90px !important;
margin-left: 250px !important;
margin-right: 0px !important;
width: 300px !important;
font-size: 28px !important;
font-weight: normal !important;
font-family: CF Crack and Bold !important;
color: white !important;
}
#donor-notification .donor {
position: absolute !important;
text-align: center !important;
margin-top: 90px !important;
margin-left: 100px !important;
margin-right: 0px !important;
width: 300px !important;
font-size: 28px !important;
font-weight: normal !important;
font-family: CF Crack and Bold !important;
color: white !important;
}

#donor-notification .title {
padding-top: 44px !important;
margin-left: 0px !important;
width: 100% !important;
float: left !important;
text-align: left !important;
}

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

[zaitr0s]

Hi again,

Can you fix this Instead? I want the name and the value up and the message under the name and value. Do you understand?

Donation pic: http://i.imgur.com/sN7qabZ.png

[TheNumbLock]

Hi again,

Can you fix this Instead? I want the name and the value up and the message under the name and value. Do you understand?

Donation pic: http://i.imgur.com/sN7qabZ.png

Like this:

Code: [Select]

#donor-notification {
width: 1920px !important;
height: 300px !important;
background-color: transparent !important;
background-image:url('http://i.imgur.com/sN7qabZ.png') !important;
background-repeat: no-repeat !important;
background-size: initial !important;
}


#donor-notification .header {
position: absolute !important;
visibility: hidden !important;
}

#donor-notification .streamname {
visibility: hidden !important;
}

#donor-notification .message {
position: absolute !important;
text-align: center !important;
margin-top: 170px !important;
margin-left: 500px !important;
margin-right: 0px !important;
width: 1900px !important;
font-size: 28px !important;
font-weight: normal !important;
font-family: CF Crack and Bold !important;
color: white !important;
}
#donor-notification .amount {
position: absolute !important;
text-align: center !important;
margin-top: 90px !important;
margin-left: 900px !important;
margin-right: 0px !important;
width: 300px !important;
font-size: 28px !important;
font-weight: normal !important;
font-family: CF Crack and Bold !important;
color: white !important;
}
#donor-notification .donor {
position: absolute !important;
text-align: center !important;
margin-top: 90px !important;
margin-left: 750px !important;
margin-right: 0px !important;
width: 300px !important;
font-size: 28px !important;
font-weight: normal !important;
font-family: CF Crack and Bold !important;
color: white !important;
}

#donor-notification .title {
padding-top: 44px !important;
margin-left: 0px !important;
width: 100% !important;
float: left !important;
text-align: left !important;
}


[zaitr0s]

Yes like that. Btw, can i change font?

[TheNumbLock]

Of course, if it is a custom font, you will need to add it via CSS code. If you want, I can add it. Just need a link to the font.

[zaitr0s]

Okeej the donation is wrong. I think you see the problem.

Pic: http://gyazo.com/c0ab55f7df5aecd4e0e6062d74ea09cf

[TheNumbLock]

Okeej the donation is wrong. I think you see the problem.

Pic: http://gyazo.com/c0ab55f7df5aecd4e0e6062d74ea09cf

Ya It seems to only go as far as this: http://puu.sh/h6csO/4dde311989.jpg

Can't seem to make it go any farther. I just adjusted the width under .message part of the CSS

[zaitr0s]

Go for that so far, i fix a other pic later.

[zaitr0s]

Can you fix it like that you did it? btw you cant make it scrolling?

[TheNumbLock]

Can you fix it like that you did it? btw you cant make it scrolling?

You could, but it would scroll like that, it wouldn't be one line, it would scroll just like it is, across it.

Edit: Fixed the CSS up above in the last donation one.