1
0
Fork 0
mirror of https://github.com/haselkern/Minecraft-ArmorStand.git synced 2025-05-17 15:05:33 +00:00

Donation++

I was told that you could hardly tell that it was possible to make
donations. This should make it more prominent, though I did my best to
not make it annoying.
This commit is contained in:
Lars Martens 2016-02-22 14:24:55 +01:00
parent ccf382b072
commit fa573a60b4
3 changed files with 47 additions and 22 deletions

View file

@ -25,19 +25,22 @@
<div id="gl"></div> <div id="gl"></div>
<div id="card"> <div id="donationanim" class="card">
Like it?<br/>
Consider donating :)<br/>
<img src="images/donate-color.png" />
</div>
<div class="right card">
<h1>MINECRAFT ARMORSTAND</h1> <h1>MINECRAFT ARMORSTAND</h1>
<div class="padding"> <div class="padding">
<center> <center>
<a href="https://github.com/haselkern/Minecraft-ArmorStand" target="_blank"><img src="images/github.png" alt="GitHub" title="GitHub" /></a> <a href="https://github.com/haselkern/Minecraft-ArmorStand" target="_blank"><img src="images/github.png" alt="GitHub" title="GitHub" /></a>
<a href="http://www.twitter.com/haselcode" target="_blank"><img src="images/twitter.png" alt="Twitter" title="Twitter" /></a> <a href="http://www.twitter.com/haselcode" target="_blank"><img src="images/twitter.png" alt="Twitter" title="Twitter" /></a>
<div id="donate"> <a href="https://www.paypal.com/cgi-bin/webscr?cmd=_s-xclick&hosted_button_id=GRVLAZE7UED9Y" target="_blank" title="Like it? Donate :)">
<a href="https://www.paypal.com/cgi-bin/webscr?cmd=_s-xclick&hosted_button_id=RRRKAAH4JNBZ8" target="_blank" title="Like it? Donate :)"> <img src="images/donate-color.png" alt="Donate" />
<img src="images/donate.png" alt="Donate" /> </a>
<img class="colorful" src="images/donate-color.png" alt="Donate" />
</a>
</div>
</center> </center>
<br> <br>
<span class="padding" style="cursor: pointer;" onclick="javascript:$('#troubleshooting').slideToggle();"> <span class="padding" style="cursor: pointer;" onclick="javascript:$('#troubleshooting').slideToggle();">
@ -184,7 +187,7 @@
</div> </div>
<div id="card"> <div class="right card">
<span class="padding" style="cursor: pointer;" onclick="javascript:$('#getcommandblock').slideToggle();"> <span class="padding" style="cursor: pointer;" onclick="javascript:$('#getcommandblock').slideToggle();">
+ Obtain a command block + Obtain a command block
</span> </span>

View file

@ -124,6 +124,29 @@ $(document).ready(function(){
} }
}); });
// Animate donation div
var donationheight = $("#donationanim").height() * 1.5;
$("#donationanim").css({
"transform" : "translateY(-"+donationheight+"px)",
"visibility" : "visible"
});
// Slide in
setTimeout(function(){
$("#donationanim").css({
"transform" : "translateY(0px)",
"transition" : "400ms",
});
// Slide out
setTimeout(function(){
$("#donationanim").css({
"transform" : "translateY(-"+donationheight+"px)",
});
}, 4000);
}, 2000);
}); });
function setup(){ function setup(){

View file

@ -30,20 +30,14 @@ a{
color: #000000; color: #000000;
} }
#donate{ #donationanim{
width: 64px;
height: 64px;
display: inline;
position: relative;
}
#donate .colorful{
opacity: 0;
position: absolute; position: absolute;
left: 0; width: 300px;
transition: 0.5s; left: 50%;
} margin-left: -150px;
#donate:hover .colorful{ padding: 5px;
opacity: 1; text-align: center;
visibility: hidden;
} }
#gl{ #gl{
@ -54,10 +48,14 @@ a{
position: fixed; position: fixed;
} }
#card{ .card{
background-color: #ffffff; background-color: #ffffff;
box-shadow: 0 2px 4px #555555; box-shadow: 0 2px 4px #555555;
margin: 0.5em; margin: 0.5em;
border-radius: 3px;
}
.right{
margin-left: 60%; margin-left: 60%;
} }
@ -70,6 +68,7 @@ a{
padding: 1em; padding: 1em;
font-family: monospace; font-family: monospace;
background-color: #37474f; background-color: #37474f;
border-radius: 3px;
color: #ffffff; color: #ffffff;
} }