WEBSITES FOR 200k!

Anything Helmet Heroes related can be posted here.

WEBSITES FOR 200k!

Postby TrollMeowFace » Sun Jun 26, 2016 1:26 pm

Heyo! I thought I would bring my coding expertise to Helmet Heroes. If you want a website for anything, It will cost 200k in game money. I might make some exceptions however if it is a small project. Add me as a friend and message me and your website will be done in a week! Heres an example of some of my code.
Code: Select all
<html class="gr__mattbilik_co_nf"><!-- Oi, why are you looking through my code?--><head>
<style>
/* ----------- iPad mini ----------- */

/* Portrait and Landscape */
@media only screen
  and (min-device-width: 768px)
  and (max-device-width: 1024px)
  and (-webkit-min-device-pixel-ratio: 1) {

}

/* Portrait */
@media only screen
  and (min-device-width: 768px)
  and (max-device-width: 1024px)
  and (orientation: portrait)
  and (-webkit-min-device-pixel-ratio: 1) {

}

/* Landscape */
@media only screen
  and (min-device-width: 768px)
  and (max-device-width: 1024px)
  and (orientation: landscape)
  and (-webkit-min-device-pixel-ratio: 1) {

}

/* ----------- iPad 1 and 2 ----------- */
/* Portrait and Landscape */
@media only screen
  and (min-device-width: 768px)
  and (max-device-width: 1024px)
  and (-webkit-min-device-pixel-ratio: 1) {

}

/* Portrait */
@media only screen
  and (min-device-width: 768px)
  and (max-device-width: 1024px)
  and (orientation: portrait)
  and (-webkit-min-device-pixel-ratio: 1) {

}

/* Landscape */
@media only screen
  and (min-device-width: 768px)
  and (max-device-width: 1024px)
  and (orientation: landscape)
  and (-webkit-min-device-pixel-ratio: 1) {

}

/* ----------- iPad 3 and 4 ----------- */
/* Portrait and Landscape */
@media only screen
  and (min-device-width: 768px)
  and (max-device-width: 1024px)
  and (-webkit-min-device-pixel-ratio: 2) {

}

/* Portrait */
@media only screen
  and (min-device-width: 768px)
  and (max-device-width: 1024px)
  and (orientation: portrait)
  and (-webkit-min-device-pixel-ratio: 2) {

}

/* Landscape */
@media only screen
  and (min-device-width: 768px)
  and (max-device-width: 1024px)
  and (orientation: landscape)
  and (-webkit-min-device-pixel-ratio: 2) {

}
/* ----------- iPhone 4 and 4S ----------- */

/* Portrait and Landscape */
@media only screen
  and (min-device-width: 320px)
  and (max-device-width: 480px)
  and (-webkit-min-device-pixel-ratio: 2) {

}

/* Portrait */
@media only screen
  and (min-device-width: 320px)
  and (max-device-width: 480px)
  and (-webkit-min-device-pixel-ratio: 2)
  and (orientation: portrait) {
}

/* Landscape */
@media only screen
  and (min-device-width: 320px)
  and (max-device-width: 480px)
  and (-webkit-min-device-pixel-ratio: 2)
  and (orientation: landscape) {

}

/* ----------- iPhone 5 and 5S ----------- */

/* Portrait and Landscape */
@media only screen
  and (min-device-width: 320px)
  and (max-device-width: 568px)
  and (-webkit-min-device-pixel-ratio: 2) {
   div.flip-container {
   display.none;
   }
 

}

/* Portrait */
@media only screen
  and (min-device-width: 320px)
  and (max-device-width: 568px)
  and (-webkit-min-device-pixel-ratio: 2)
  and (orientation: portrait) {
   div.flip-container {
   display.none;
   }
}

/* Landscape */
@media only screen
  and (min-device-width: 320px)
  and (max-device-width: 568px)
  and (-webkit-min-device-pixel-ratio: 2)
  and (orientation: landscape) {
   div.flip-container {
   display.none;
   }
}

/* ----------- iPhone 6 ----------- */

/* Portrait and Landscape */
@media only screen
  and (min-device-width: 375px)
  and (max-device-width: 667px)
  and (-webkit-min-device-pixel-ratio: 2) {
   div.flip-container {
   display.none;
   }
}

/* Portrait */
@media only screen
  and (min-device-width: 375px)
  and (max-device-width: 667px)
  and (-webkit-min-device-pixel-ratio: 2)
  and (orientation: portrait) {
   div.flip-container {
   display.none;
   }
}

/* Landscape */
@media only screen
  and (min-device-width: 375px)
  and (max-device-width: 667px)
  and (-webkit-min-device-pixel-ratio: 2)
  and (orientation: landscape) {
   div.flip-container {
   display.none;
   }
}

/* ----------- iPhone 6+ ----------- */

/* Portrait and Landscape */
@media only screen
  and (min-device-width: 414px)
  and (max-device-width: 736px)
  and (-webkit-min-device-pixel-ratio: 3) {
   div.flip-container {
   display.none;
   }
}

/* Portrait */
@media only screen
  and (min-device-width: 414px)
  and (max-device-width: 736px)
  and (-webkit-min-device-pixel-ratio: 3)
  and (orientation: portrait) {
   div.flip-container {
   display.none;
   }
}

/* Landscape */
@media only screen
  and (min-device-width: 414px)
  and (max-device-width: 736px)
  and (-webkit-min-device-pixel-ratio: 3)
  and (orientation: landscape) {
   div.flip-container {
   display.none;
   }
}
.flip-container {
   perspective: 1000;
}

   .flip-container:hover .flipper, .flip-container.hover .flipper {
      transform: rotateY(180deg);
   }

.flip-container, .front, .back {
   width: 320px;
   height: 480px;
}


.flipper {
   transition: 0.6s;
   transform-style: preserve-3d;

   position: relative;
}


.front, .back {
   backface-visibility: hidden;

   position: absolute;
   top: 0;
   left: 0;
}


.front {
   z-index: 2;
   /* for firefox 31 */
   transform: rotateY(0deg);
}


.back {
   transform: rotateY(180deg);
}
body {

  background-image: url(http://i.stack.imgur.com/jGlzr.png);
 

  background-position: center center;
 

  background-repeat: no-repeat;
 

  background-attachment: fixed;
 

  background-size: cover;
 
  background-color: #464646;
}
.image {
   position: relative;
   width: 100%;

}

h3 {
   position: absolute;
   top: 100px;
   left: 100;
   width: 100%;
}
h5 {
position: absolute;
   top: 180px;
   left: -10;
   width: 100%;
}

.push_button {
   position: relative;
   width:220px;
   height:40px;
   text-align:center;
   color:#FFF;
   text-decoration:none;
   line-height:43px;
   font-family:'Oswald', Helvetica;
   display: block;
   margin: 30px;
}
.push_button:before {
   background:#f0f0f0;
   background-image:-webkit-gradient(linear, 0% 0%, 0% 100%, from(#D0D0D0), to(#f0f0f0));
   
   -webkit-border-radius:5px;
   -moz-border-radius:5px;
   border-radius:5px;
   
   -webkit-box-shadow:0 1px 2px rgba(0, 0, 0, .5) inset, 0 1px 0 #FFF;
   -moz-box-shadow:0 1px 2px rgba(0, 0, 0, .5) inset, 0 1px 0 #FFF;
   box-shadow:0 1px 2px rgba(0, 0, 0, .5) inset, 0 1px 0 #FFF;
   
   position: absolute;
   content: "";
   left: -6px; right: -6px;
   top: -6px; bottom: -10px;
   z-index: -1;
}

.push_button:active {
   -webkit-box-shadow:0 1px 0 rgba(255, 255, 255, .5) inset, 0 -1px 0 rgba(255, 255, 255, .1) inset;
   top:5px;
}
.push_button:active:before{
   top: -11px;
   bottom: -5px;
   content: "";
}

.blue {
   text-shadow:-1px -1px 0 #2C7982;
   background: #3EACBA;
   border:1px solid #379AA4;
   background-image:-webkit-linear-gradient(top, #48C6D4, #3EACBA);
   background-image:-moz-linear-gradient(top, #48C6D4, #3EACBA);
   background-image:-ms-linear-gradient(top, #48C6D4, #3EACBA);
   background-image:-o-linear-gradient(top, #48C6D4, #3EACBA);
   background-image:linear-gradient(top, #48C6D4, #3EACBA);
   
   -webkit-border-radius:4px;
   -moz-border-radius:4px;
   border-radius:4px;
   
   -webkit-box-shadow:0 1px 0 rgba(255, 255, 255, .5) inset, 0 -1px 0 rgba(255, 255, 255, .1) inset, 0 4px 0 #338A94, 0 4px 2px rgba(0, 0, 0, .5);
   -moz-box-shadow:0 1px 0 rgba(255, 255, 255, .5) inset, 0 -1px 0 rgba(255, 255, 255, .1) inset, 0 4px 0 #338A94, 0 4px 2px rgba(0, 0, 0, .5);
   box-shadow:0 1px 0 rgba(255, 255, 255, .5) inset, 0 -1px 0 rgba(255, 255, 255, .1) inset, 0 4px 0 #338A94, 0 4px 2px rgba(0, 0, 0, .5);
}

.blue:hover {
   background: #48C6D4;
   background-image:-webkit-linear-gradient(top, #3EACBA, #48C6D4);
   background-image:-moz-linear-gradient(top, #3EACBA, #48C6D4);
   background-image:-ms-linear-gradient(top, #3EACBA, #48C6D4);
   background-image:-o-linear-gradient(top, #3EACBA, #48C6D4);
   background-image:linear-gradient(top, #3EACBA, #48C6D4);
}
.tb1 {
    padding: 10px;
   width: 230px;
   border: 1px solid #3366FF;
   border-left: 4px solid #3366FF;
}
div.wrapper{ 
    float:left;
    position:relative; 

div.description{ 
    position:absolute;
    bottombottom:0px;
    left:0px; 
    width:100%; 
    /* styling bellow */ 
    background-color:black; 
    font-family: 'tahoma'; 
    font-size:15px; 
    color:white; 
    opacity:0.6; 
    filter:alpha(opacity=60);

p.description_content{ 
    padding:10px; 
    margin:0px; 

#screensmall
{
display: none;
}
@media only screen and (max-width: 900px) {
    div.wrapper {
        display: none;
    }
}
@media only screen and (max-width: 900px) {
    #screensmall {
        display: inline;
    }
}
#left
{

text-align:left;
}
</style>
<script type="text/javascript">
function changeText2(){
   var userInput = document.getElementById('userInput').value;
   document.getElementById('boldStuff2').innerHTML = userInput;
}
function extra(){


}
</script>


<title>Matthew Bilik</title>
</head>
<body data-gr-c-s-loaded="true" style="">
<h1 style="font-family:courier">Welcome to the site <b id="boldStuff2">visitor</b> </h1>
<table>
<tbody><tr>
<td></td>
<td></td>
   
<td><input type="text" class="tb1" id="userInput" value="Please enter your name"></td>
</tr>
</tbody></table>
<input type="button" class="push_button blue" onclick="changeText2()" value="Change Name">
<center>
<div class="flip-container" ontouchstart="this.classList.toggle('hover');">
   <div class="flipper">
      <div class="front">
         <img src="http://media.panjury.com/uploads/trial/yo_1402768806.png">
         <h2 style="font-family:Courier New">Hey! You there! Scroll over me!</h2>
      </div>
      <div class="back">
      <div class="image">
                <div style="position: relative; left: 0; top: 0;">
      <h3 style="font-family:courier">Welcome to Matthew Bilik's Portfolio</h3>
                <h5 style="font-family:courier">im matt. im a 13 year old nerd <br>focused on mastering html, <br>css and the illustrious arduino.<br> this website is a haphazard. excuse <br>me for my lack of organization.<br>also hi schools im smart</h5>
                <img src="http://pcache.alexa.com/images/settings/windows7/notepad-blank.bb647ae001a4fc7d168c240e01088787.png" width="500" height="500">
   </div>
      </div>
      </div>
   </div>
</div>
<center>
<br>
<br>
<br>
<br>
<br>
<table colspan="500">
<tbody><tr>
<td>
<div class="wrapper"> 
    <img src="https://netbeans.org/images_www/v7/3/features/java-editor-full.png" width="100" height="90"> 
   
    <div class="description"> 
     
        <p class="description_content">thats a picture of my program</p> 
        <a style="color:white" href="google.com">java calculators</a>
    </div> 

</div>
  <div class="wrapper"> 
 
    <img src="me.jpg" width="100" height="90"> 
   
    <div class="description"> 
     
        <p class="description_content">🌇</p> 
       
    </div> 

</div> 
<div class="wrapper"> 
 
        <a href="https://github.com/skrumb"><img src="https://cdn.tutsplus.com/net/uploads/2013/08/github-collab-retina-preview.gif" width="100" height="90"></a> 
   
    <div class="description"> 
     
        <p class="description_content">github! you can click on it to view my code!</p> 
       
    </div> 

</div>
  <div class="wrapper"> 
 
    <a href="http://matthewbilik.co.nf/"><img src="oldsite.png" width="100" height="90"></a>
   
    <div class="description"> 
     
        <p class="description_content">my old website! click on it to see it!</p> 
       
    </div> 

</div> 
<div class="wrapper"> 
 
    <img src="me.jpg" width="100" height="90"> 
   
    <div class="description"> 
     
        <p class="description_content">thats my hair</p> 
       
    </div> 

</div>
  <div class="wrapper"> 
 
    <img src="me.jpg" width="100" height="90"> 
   
    <div class="description"> 
     
        <p class="description_content">thats my hair</p> 
       
    </div> 

</div> 
<div class="wrapper"> 
 
    <img src="me.jpg" width="100" height="90"> 
   
    <div class="description"> 
     
        <p class="description_content">thats my hair</p> 
       
    </div> 

</div>
  <div class="wrapper"> 
 
    <img src="me.jpg" width="100" height="90"> 
   
    <div class="description"> 
     
        <p class="description_content">thats my hair</p> 
       
    </div> 

</div> 
<div class="wrapper"> 
 
    <img src="me.jpg" width="100" height="90"> 
   
    <div class="description"> 
     
        <p class="description_content">thats my hair</p> 
       
    </div> 

</div>
  <div class="wrapper"> 
 
    <img src="me.jpg" width="100" height="90"> 
   
    <div class="description"> 
     
        <p class="description_content">thats my hair</p> 
       
    </div> 

</div> 
<div class="wrapper"> 
 
    <img src="me.jpg" width="100" height="90"> 
   
    <div class="description"> 
     
        <p class="description_content">thats my hair</p> 
       
    </div> 

</div>
  <div class="wrapper"> 
 
    <img src="me.jpg" width="100" height="90"> 
   
    <div class="description"> 
     
        <p class="description_content">thats my hair</p> 
       
    </div> 

</div> 
<div class="wrapper"> 
 
    <img src="me.jpg" width="100" height="90"> 
   
    <div class="description"> 
     
        <p class="description_content">thats my hair</p> 
       
    </div> 

</div>
  <div class="wrapper"> 
 
    <img src="me.jpg" width="100" height="90"> 
   
    <div class="description"> 
     
        <p class="description_content">thats my hair</p> 
       
    </div> 

</div> 
<div class="wrapper"> 
 
    <img src="me.jpg" width="100" height="90"> 
   
    <div class="description"> 
     
        <p class="description_content">thats my hair</p> 
       
    </div> 

</div>
  <div class="wrapper"> 
 
    <img src="me.jpg" width="100" height="90"> 
   
    <div class="description"> 
     
        <p class="description_content">thats my hair</p> 
       
    </div>
   </div></td>
</tr>   
</tbody></table>
<div id="screensmall">
<center>
<p style="font-family:Courier New">Please increase the size of your browser to view photos</p>
</center></div>
 


</center></center></body></html>
Image
I make websites for 200k!, Message me and I'll make you one.
TrollMeowFace
 
Posts: 6
Joined: Wed Nov 27, 2013 5:30 pm

Return to General

Who is online

Users browsing this forum: No registered users and 3 guests

cron