API tools faq
paste
Advertisement
hekirei

perfilhtml5

hekirei
Apr 30th, 2016
114
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 5 20.63 KB | None | 0 0
raw download clone embed print report
  1.  
  2. <style>
  3.  .video{
  4.       position:absolute;
  5.   top:-50%;
  6.   left:0%;
  7.   width:100%;
  8.   height:200%;
  9.   z-index:6;
  10.      pointer-events:all;
  11.               overflow-x:hidden;
  12. overflow-y:hidden;
  13. transition: all 2s ease-in-out;
  14. }
  15.  
  16. .acontvideo:hover, .avideo.hover_effect {
  17.       transform: translate(0px ,0px) scale(2,2);
  18.       top:0%;
  19.       height:100%;
  20.       opacity:0.8;
  21.    
  22.    }
  23.  
  24.  
  25.     .contvideo{
  26.      background-color:#000;
  27.     position: absolute;
  28.     height: 50%;
  29.     width: 50%;
  30.     z-index: 4;
  31.     opacity: 1.5;
  32. border-radius:10px;
  33.     top: 20%;
  34.         transition: all 2s ease-in-out;
  35.         left: 25%;
  36.         border:0px solid #c0bccd;
  37.     }
  38.     .fondo1{
  39.       position: absolute;
  40.       height: 102%;
  41.       width: 102%;
  42.       z-index: 2;
  43.       top: -1%;
  44.       left: -1%;
  45.         background: #000 url(http://orig00.deviantart.net/a9d7/f/2016/039/9/e/gifdefondo_by_hekirei-d9r1tar.gif);
  46.         background-size: 20% 20%;
  47.         margin: 0%;
  48.          }
  49.         .barranegra{
  50.             background-color: black;
  51.             position: absolute;
  52.             z-index: 1;
  53.             width: 100%;
  54.             height: 100%;
  55.             left: 0%;
  56.             top: 0%;
  57.         }
  58.     .chicaanime{
  59.         position: absolute;
  60.         z-index: 1;
  61.         height: 75%;
  62.         width: 20%;
  63.         top: 20%;
  64.         left: 0%;
  65.     }
  66. .gif1{
  67.   position: absolute;
  68.     z-index: 2;
  69.     height: 33%;
  70.     width: 25%;
  71.     left: 15%;
  72.     top: 70%;
  73.    }
  74.  
  75.     .gifanime{
  76.        
  77.       position: absolute;
  78.     z-index: 2;
  79.     height: 30%;
  80.     width: 20%;
  81.     left: 40%;
  82.     top: 70%;  
  83.     }
  84. .visitlogger{
  85. position:absolute;
  86. height:4%;
  87. width:7%;
  88.    background-color:#858585;
  89. z-index:2;
  90. border-radius:1%;
  91.                 -webkit-transition:all 1s ease;
  92. -o-transition:all 1s ease;
  93. transition:all 1s ease;
  94.       top: 70%;
  95. left:1%;
  96.      
  97.   }
  98.     .barry1{
  99.         text-align: center;
  100.     }
  101.     .barry1:hover{
  102.         opacity: 0.0;
  103.     }
  104. .visitlogger:hover{
  105. width:100%;
  106. height:100%;
  107. position:absolute;
  108. border-radius:0%;
  109.     background: transparent;
  110.             -webkit-transition:all 1s ease;
  111. -o-transition:all 1s ease;
  112. transition:all 1s ease;
  113. left:1%;
  114.   top: 0%;
  115.  }
  116. .barry{
  117.   position:absolute;
  118. height:100%;
  119. width:100%;
  120.     background-position: absolute;
  121.     background-size: 100% 100%;
  122.     opacity: 0.0;
  123.             -webkit-transition:all 1s ease;
  124. -o-transition:all 1s ease;
  125. transition:all 1s ease;
  126. left:0%;
  127.  }
  128. .barry:hover{
  129.     background:url("http://www.dayztv.com/wp-content/uploads/avatars/4466/2a1e0fc0b926915dd330bcb689720452-bpthumb.png" )no-repeat;
  130.     background-size: 25% 100%;
  131.     opacity: 1.0;
  132.  }
  133.     .transparent{
  134.         position: relative;
  135.         z-index: 99;
  136.         height: 100%;
  137.         width: 100%;
  138.         left: 25%;
  139.     }
  140.     .bgazul{
  141.         position: absolute;
  142.         z-index: 1;
  143.         height: 100%;
  144.         width: 60%;
  145.         right: 0%;
  146.     }
  147.      .madara{
  148.         position: absolute;
  149.         z-index: 5;
  150.         height: 90%;
  151.         width: 30%;
  152.         right: 0%;
  153.          top:
  154.     }
  155.               #chatwithme {
  156.         color: aqua;
  157.         text-align: center;
  158. position:absolute;
  159. height:100%;
  160. left:0%;
  161. top:0%;
  162. width:100%;
  163.     }
  164.     .charlar{
  165.   left: 40%;
  166.   top: 85%;
  167.   position: absolute;
  168.   z-index: 16;
  169.     height: 7%;
  170.   width: 15%;
  171.         opacity: 0.5;
  172. background-color: #6b6b6b;
  173.     border-radius: 10px  30px 10px 10px;
  174.         box-shadow: 5px 5px 5px #00fcff;
  175.                       -webkit-transition:all 1s ease;
  176. -o-transition:all 1s ease;
  177. transition:all 1s ease;
  178.        
  179. }
  180.     .charlar:hover{
  181.         opacity: 1;
  182.         box-shadow: 10px 10px 5px #00fcff;
  183.     }
  184.       </style>
  185. <script language="javascript">document.title=("Holas :)")</script>
  186. <div class="todo"><div class="body"></div>
  187. <style>
  188.     .body{
  189.         position: absolute;
  190.         background-color: 000;
  191.         height: 100%;
  192.         width: 100%;
  193.         left: 0%;
  194.         overflow-x:hidden;
  195. overflow-y:hidden;
  196.         top: 0%;
  197.     }
  198.     *{        padding: 0px;
  199.         margin: 0px;
  200.              overflow-x:hidden;
  201. overflow-y:hidden;}
  202. #box{
  203.     border-radius: 0px 0px 0px 0px;
  204.    
  205. font-family: 'Laila', serif;
  206. border:0px solid #c0bccd;
  207. height:100%;
  208. width:100%;
  209. font-size:9px;
  210. overflow:auto;
  211. color:#808080;
  212. position:absolute;
  213.          overflow-x:hidden;
  214. overflow-y:hidden;  
  215. top:0%;
  216.     padding: 0px;
  217.         margin: 0px;
  218. left:0%;
  219.     z-index: 6;
  220.     opacity: 1.6;
  221. }
  222. .todo{
  223. position:fixed;
  224. z-index:4;
  225. height:100%;
  226. width:100%;
  227. left:0%;
  228. top:0%;
  229. }
  230. .dy3{
  231.     position: relative;
  232.     left: 90%;
  233.     top: 15%;
  234. color:#808080;
  235. font-family:tahoma;
  236. font-size:18px;
  237. display:block;
  238. text-decoration:none;
  239. height:15%;
  240. width:8%;
  241.     margin: 1%;
  242. border-radius:50%;
  243. background-color:#5c5c5c;
  244. color:00ebdd;
  245. border:1px solid #00fff0;
  246. z-index:9999;
  247.     text-align: center;
  248.     opacity: 0.7;
  249.                 -webkit-transition:all 1s ease;
  250. -o-transition:all 1s ease;
  251. transition:all 1s ease;
  252.    
  253.  
  254. }
  255.  
  256.     .disp{
  257.         position: absolute;
  258.         z-index: 9;
  259.         left: 0%;
  260.         top: 0%;
  261.         width: 45%;
  262.         height: 100%;
  263.                     overflow-x:hidden;
  264. overflow-y:hidden;
  265.        
  266.     }
  267.  
  268. .dy3:hover{
  269. z-index:9999;
  270. -webkit-transition: all 500ms cubic-bezier(0.250, 0.250, 0.750, 0.750);
  271. -moz-transition: all 500ms cubic-bezier(0.250, 0.250, 0.750, 0.750);
  272. -o-transition: all 500ms cubic-bezier(0.250, 0.250, 0.750, 0.750);
  273.     transition: all 500ms cubic-bezier(0.250, 0.250, 0.750, 0.750);
  274. text-decoration:none;
  275. color:#00fff0;
  276. background-color:#303030;
  277.     opacity: 1;
  278. border:2px solid #00fff0;
  279.  
  280. }
  281. .dy2{
  282. position: absolute;
  283.     background-color: #5c5c5c;
  284.     background-size: 100% 100%;
  285.   height: 7%;
  286.     width: 10%;
  287.     color: #00ebdd;
  288.     right: 0%;
  289.     display:block;
  290.     top: 48%;
  291.     z-index: 990;
  292.     font-family: tahoma;
  293.     text-decoration:none;
  294.     text-align: center;
  295.     border:0px solid #ff0000;
  296.     border-radius: 0px 0px 0px 500px;
  297.     font-size:18px;
  298.     }
  299.     .dy2:hover{
  300.         text-decoration:none;
  301. background-color: #00fff0;
  302.         -webkit-transition: all 500ms cubic-bezier(0.250, 0.250, 0.750, 0.750);
  303. -moz-transition: all 500ms cubic-bezier(0.250, 0.250, 0.750, 0.750);
  304. -o-transition: all 500ms cubic-bezier(0.250, 0.250, 0.750, 0.750);
  305.     transition: all 500ms cubic-bezier(0.250, 0.250, 0.750, 0.750);
  306.     }
  307.     .dy1:hover{
  308.         background-color:#a6a6a6;
  309.         -webkit-transition: all 500ms cubic-bezier(0.250, 0.250, 0.750, 0.750);
  310. -moz-transition: all 500ms cubic-bezier(0.250, 0.250, 0.750, 0.750);
  311. -o-transition: all 500ms cubic-bezier(0.250, 0.250, 0.750, 0.750);
  312.     transition: all 500ms cubic-bezier(0.250, 0.250, 0.750, 0.750);
  313.         text-decoration:none;
  314.     }
  315.     .dy1{
  316. position: fixed;
  317.     background-color: #5c5c5c;
  318.     background-size: 100% 100%;
  319.   height: 7%;
  320.     width: 10%;
  321.     color: aliceblue;
  322.     right: 0%;
  323.     top: 20%;
  324.         font-family: tahoma;
  325.     text-decoration:none;
  326.     z-index: 99099999;
  327.     text-align: center;
  328.     border:0px solid #ff0000;
  329.     border-radius: 500px 0px 0px 0px;
  330.     color:#fff;
  331. font-size:18px;
  332. display:block;
  333. text-decoration:none;
  334.     }.dy:hover{
  335.         text-decoration:none;
  336.     }
  337.     .imgbox{
  338.         position: absolute;
  339.         top:0%;
  340.         left: 0%;
  341.         height: 100%;
  342.         width: 100%;
  343.               overflow-x:hidden;
  344. overflow-y:hidden;
  345.                
  346.    }
  347.                 .tab1{
  348.         position: absolute;
  349.         top:0%;
  350.         left: 0%;
  351.         height: 100%;
  352.                     background:#000 url("https://images2.alphacoders.com/545/545916.jpg") no-repeat;
  353.                     width: 100%;
  354.                     height: 100%;
  355.              background-size: 100% 100%;
  356.         border-radius: 0px 0px 0px 0px;
  357.         z-index: 99999;
  358.         }
  359.                     .tab2{
  360.                         top: 0%;
  361.                         position: absolute;
  362.                        background:#000 url("http://wallpapercave.com/wp/ozUbXUx.png") no-repeat;
  363.                     width: 100%;
  364.                     height: 100%;
  365.                         background-position: 100%;
  366.              background-size: 75% 100%;
  367.         border-radius: 5px 5px 0px 0px;
  368.         z-index: 5;
  369.         overflow-x:hidden;
  370.         left: 0%;
  371. overflow-y:hidden;  }
  372.    
  373.  
  374.  
  375.     #greet{
  376.         opacity: 2.7;
  377.         z-index: 2;
  378.         position: absolute;
  379.         height: 100%;
  380.         width: 90%;
  381.         left: 0%;
  382.         top: -8px;
  383.     }
  384.       #greet2{
  385.         opacity: 2.7;
  386.         z-index: 6;
  387.         position: absolute;
  388.         height: 100%;
  389.         width: 90%;
  390.         left: 0%;
  391.         top: -8px;
  392.     }
  393.  a{
  394. margin-left:20px;
  395. color:#000;
  396. font-family:tahoma;}
  397.  body, a:hover {cursor: url(http://cur.cursors-4u.net/cursors/cur-11/cur1026.ani), url(http://cur.cursors-4u.net/cursors/cur-11/cur1026.png), progress !important;}
  398.    
  399.  
  400. .info{
  401. background-color:#5b5b5b;
  402.     position: absolute;
  403.     height: 70%;
  404.     width: 25%;
  405.    
  406.     z-index: 79999;
  407.     opacity: 2.8;
  408.             overflow-x:scroll;
  409. overflow-y:hidden;
  410.     top: 10%;
  411.     border-color: #fff;
  412. }
  413.     .pic{
  414.         position: absolute;
  415.         left: 25%;
  416.         width: 50%;
  417.         height: 40%;
  418.         border-color: #fff;
  419.         border-style: solid;
  420.     }
  421.     b{
  422.         font-family: comic sans ms;
  423.         color:darkgrey;
  424.     }
  425.     p{
  426.         top: 25%;
  427.         position: absolute;
  428.         color:white;
  429.         text-align: center;
  430.         left: 25%;
  431.     }
  432.  
  433. <style>
  434.   ::-webkit-scrollbar {
  435.   width: 10px;574A68
  436.   height: 5px;
  437.   background-color:#fff;
  438.       opacity:0,4;
  439.   }
  440.   ::-webkit-scrollbar-button:start:decrement,
  441.   ::-webkit-scrollbar-button:end:increment {display: block;}
  442.   ::-webkit-scrollbar-button:vertical:start:increment,
  443.   ::-webkit-scrollbar-button:vertical:end:decrement {display: none;}
  444.   ::-webkit-scrollbar-button:end:increment
  445.         {background-color:#fff;
  446.   background-repeat: no-repeat;background-position:center;
  447.         -webkit-box-shadow: inset 0 0 0px rgba(0,911,499,2.0);}
  448. </style>
  449. <style>
  450.   ::-webkit-scrollbar-button:start:decrement
  451.   {background-color:#ffffff;;
  452.   background-repeat: no-repeat;background-position:center;
  453.         -webkit-box-shadow: inset 0 0 0px rgba(0,198,255,2.0);}
  454.   ::-webkit-scrollbar-thumb {
  455.   background-color:transparent;
  456.         background-color:#5b5b5b;
  457.         background-size: 100% auto;
  458.   border-left:0px solid #000000;
  459.   border-right:0px solid #000000;
  460.   border-bottom:0px solid #000000;
  461.   border-top:0px solid #000;
  462.   border-radius:20px;
  463.   }
  464.   #scrollbardolliecrave {
  465.   width:10px;
  466.   height:20px;
  467.   position: fixed;    
  468.   left: 0px;    
  469.   bottom: 0px;
  470.   }
  471.   ::-webkit-scrollbar-track {
  472.        
  473.   }
  474.  
  475. </style>
  476.  
  477. <div style="position:absolute;height:100% ;width:100%;right:0%;top:0%;">
  478.  
  479.  
  480. <a class="dy3" style="cursor:pointer;" onMouseover="cursor:pointer';" onClick="changeNavigation ('tab1')"><br>Inicio</a>
  481.  
  482.  
  483.  
  484. <a class="dy3" style="cursor:pointer;" onMouseover="cursor:pointer';" onClick="changeNavigation ('tab2')"><br>Chat</a>
  485.  
  486.  
  487.  
  488.  
  489. <a class="dy3" style="cursor:pointer;" onMouseover="cursor:pointer';" onClick="changeNavigation ('tab3')"><br>Sobre mi...</a>
  490.  
  491.  
  492. <a class="dy3" style="cursor:pointer;" onMouseover="cursor:pointer';" onClick="changeNavigation ('tab4')"><br>4</a>
  493.  
  494.  
  495. </div>
  496.  
  497.  
  498. <div id="box">
  499.  
  500.  
  501.  
  502.  
  503. </div>
  504. <div id="tab3" style="display:none">
  505.    
  506.    
  507.      
  508.    
  509.    <div class="tab1"><div id="greet2">
  510. <script src="http://pastebin.com/raw/aVDWpvT4"></script>
  511. </div>
  512.   <div class="info"><img class="pic" src="http://fp.chatango.com/profileimg/h/e/heki/full.jpg">
  513. <p><br></p>
  514.     </div>      
  515.  
  516. </div>
  517. </div>
  518. <div id="tab4" style="display:none">
  519.    
  520.    <div class="fondo1"><div class="visitlogger"><div class="barry1"><a><br>Visit Logger</a></div><div class="barry"><script  src="//barrykun.com/vl.js"></script></div></div>
  521.    
  522.       <div class="transparent"></div></div>
  523.     </div>
  524. <div id="tab1" style="display:none">
  525.  
  526.  
  527. <h1></h1>
  528.  
  529. </div>
  530.  
  531. <div id="tab2" style="display:none">
  532.     <iframe class="disp" src="http://hekii.esy.es//" '="" width="700px" height="500px" frameborder="0"></iframe>
  533. <h1>Chat</h1>
  534. <div class="tab2"></div>
  535.    
  536. <script>
  537. //<![CDATA[
  538. // Fall v2.0 By MaxxBlade - http://www.maxxblade.co.uk/fall
  539. var fallObjects=new Array();function newObject(url,height,width){fallObjects[fallObjects.length]=new Array(url,height,width);}
  540. var numObjs=15, waft=100, fallSpeed=5, wind=-1;
  541.  
  542. newObject("http://lh5.googleusercontent.com/--jcOdbfXsBs/UGS2U_spSLI/AAAAAAAADCU/G-4XZ0mSEHg/s100/hoja1.png",29,15);
  543. newObject("http://lh5.googleusercontent.com/-aE24R5QmbE4/UGS2U_hZj0I/AAAAAAAADCM/7Hb18sy3qfo/s100/hoja2.png",27,23);
  544. newObject("http://lh6.googleusercontent.com/-9H8JyoZ6j3g/UGS2U2aOamI/AAAAAAAADCQ/6zY7uKgyV2A/s100/hoja3.png",46,15);
  545. newObject("https://lh3.googleusercontent.com/-OhuXMSqpELQ/UGS2Vq8Qf0I/AAAAAAAADCg/UTCK1YQUZqA/s100/hoja4.png",36,33);
  546. function winSize(){winWidth=(moz)?window.innerWidth:document.body.clientWidth;winHeight=(moz)?window.innerHeight:document.body.clientHeight;}
  547. function fallObject(num,vari,nu){
  548. objects[num]=new Array(parseInt(Math.random()*(winWidth-waft)),-30,(parseInt(Math.random()*waft))*((Math.random()>0.5)?1:-1),0.02+Math.random()/20,0,1+parseInt(Math.random()*fallSpeed),vari,fallObjects[vari][1],fallObjects[vari][2]);
  549. if(nu==1){document.write('<img id="fO'+i+'" style="position:absolute;z-index:9;left:0%;background:none;border:0;padding:0;box-shadow:none;" src="'+fallObjects[vari][0]+'">'); }
  550. }
  551. function fall(){
  552. for(i=0;i<numObjs;i++){
  553. var fallingObject=document.getElementById('fO'+i);
  554. if((objects[i][1]>(winHeight-(objects[i][5]+objects[i][7])))||(objects[i][0]>(winWidth-(objects[i][2]+objects[i][8])))){fallObject(i,objects[i][6],0);}
  555. objects[i][0]+=wind;objects[i][1]+=objects[i][5];objects[i][4]+=objects[i][3];
  556. with(fallingObject.style){ top=objects[i][1]+winOffset+"px";left=objects[i][0]+(objects[i][2]*Math.cos(objects[i][4]))+"px";}
  557. }
  558. ...("fall()",31);
  559. }
  560. var objects=new Array(),winOffset=0,winHeight,winWidth,togvis,moz=(document.getElementById&&!document.all)?1:0;winSize();
  561. for (i=0;i<numObjs;i++){fallObject(i,parseInt(Math.random()*fallObjects.length),1);}
  562. window.onresize=winSize;fall();
  563. //]]>
  564. </script>
  565.  
  566.  </div>
  567. <script>document.body.oncontextmenu=function(){return false};</script>
  568.  
  569. <script>function changeNavigation(id) {document.getElementById('box').innerHTML=document.getElementById(id).innerHTML}</script>
  570. <script>
  571. function disabletext(e){
  572. return false
  573. }
  574. function reEnable(){
  575. return true
  576. }
  577. document.onselectstart=new Function ("return false")
  578. if (window.sidebar){
  579. document.onmousedown=disabletext
  580. document.onclick=reEnable
  581. }
  582. </script>
  583. <div class="contvideo"><div class="video"><iframe id="video" width="100%" height="100%"  src="https://www.youtube.com/embed/?1&list=PL9eyGR3XuNra7LBNiqf3C8gpKAdRKOFK2&amp;start=0&amp;controls=0&amp;autoplay=1&amp;controls=0&amp;disablekb=1&amp;fs=0&amp;modestbranding=1&amp;rel=0&amp;showinfo=0&amp;iv_load_policy=3&amp;enablejsapi=1&html5=1" frameborder="0" allowfullscreen></iframe></div>
  584.    
  585.        
  586. </div>
  587.        
  588.    
  589.     <!--
  590. SVG ==
  591. http://thenounproject.com/term/play/23255/
  592. http://css-tricks.com/svg-tabs-using-svg-shape-template/
  593. -->
  594. <svg class="defs">
  595.   <defs>
  596.     <path id="pause-button-shape"  d="M24,0C10.745,0,0,10.745,0,24s10.745,24,24,24s24-10.745,24-24S37.255,0,24,0z M21,33.064c0,2.201-1.688,4-3.75,4
  597.  s-3.75-1.799-3.75-4V14.934c0-2.199,1.688-4,3.75-4s3.75,1.801,3.75,4V33.064z M34.5,33.064c0,2.201-1.688,4-3.75,4
  598.  s-3.75-1.799-3.75-4V14.934c0-2.199,1.688-4,3.75-4s3.75,1.801,3.75,4V33.064z"/>
  599.     <path id="play-button-shape"  d="M24,0C10.745,0,0,10.745,0,24s10.745,24,24,24s24-10.745,24-24S37.255,0,24,0z M31.672,26.828l-9.344,9.344
  600.  C20.771,37.729,19.5,37.2,19.5,35V13c0-2.2,1.271-2.729,2.828-1.172l9.344,9.344C33.229,22.729,33.229,25.271,31.672,26.828z"/>
  601.   </defs>
  602. </svg>
  603.  
  604. <div class="buttons">
  605.   <!-- if we needed to change height/width we could use viewBox here -->
  606.   <svg class="button" id="play-button"><br>
  607.     <use xlink:href="#play-button-shape">
  608.   </svg>
  609.       <svg class="button" id="pause-button"><br>
  610.     <use xlink:href="#pause-button-shape">
  611.   </svg>
  612. </div>
  613.     <!--parche en negro-->
  614. <div class="parche"></div>
  615.    
  616.  
  617.    
  618. <script type="text/javascript">
  619. document.oncontextmenu = function(){return false;}</script>
  620.     <!----favicon--->
  621.  
  622. <script>
  623. (function() {
  624.     var link = document.createElement('link');
  625.     link.type = 'image/x-icon';
  626.     link.rel = 'shortcut icon';
  627.     link.href ='http://www.algarexperience.com/static/images/favicon/favicon-16x16.png';
  628.     document.getElementsByTagName('head')[0].appendChild(link);
  629. }());
  630. </script>
  631.  
  632.     <!--Bienvenida-->
  633.  
  634.  
  635.  
  636.     <div class="boton1"></div>
  637.  
  638.  
  639. <style type="text/css">
  640.  
  641.  
  642. body, a:hover {cursor: url(http://cur.cursors-4u.net/cursors/cur-11/cur1026.ani), url(http://cur.cursors-4u.net/cursors/cur-11/cur1026.png), progress !important;}
  643. #video{
  644.   top:0%;
  645.   position:absolute;
  646.     height: 100%;
  647.     width: 100%;
  648.  
  649. }
  650.     .pause{
  651.         position: absolute;
  652.         z-index: 999;
  653.     }
  654.  
  655.  
  656.         <style>
  657. .button {
  658.     position: absolute;
  659.   width: 48px;
  660.   height: 48px;
  661.   cursor: pointer;
  662.     z-index: 99999;
  663.   &:hover {
  664.    fill: white;
  665.   }
  666. }
  667.  
  668. .defs {
  669.   position: absolute;
  670.   top: -9999px;
  671.   left: -9999px;
  672.     z-index: 99999;
  673. }
  674.  
  675. .buttons {
  676. height: 5%;
  677.     width: 10%;
  678.     left: 45%;
  679.     background-color: #c6c6c6;
  680.     opacity: 1.5;
  681.     position: absolute;
  682.     z-index: 10;
  683.     top: 95%;
  684.     border-radius: 20px;
  685. }
  686.  
  687.     #pause-button{
  688.         position: absolute;
  689.         right: 5%;
  690.         z-index: 10;
  691.         height: 80%;
  692.         width: 28%;
  693.         top: 10%;
  694.         background:url("http://orig15.deviantart.net/186e/f/2016/039/0/d/pause_by_hekirei-d9r2gif.png")no-repeat;
  695.         background-size: 100% 100%;
  696.         border-radius: 20px;
  697.     }
  698.     #play-button{
  699.         position: absolute;
  700.         left: 7%;
  701.         height: 80%;
  702.         width: 28%;
  703.         z-index: 10;
  704.         top: 10%;
  705.         background:url("http://orig15.deviantart.net/8fa5/f/2016/039/0/b/play_by_hekirei-d9r2gmu.png")no-repeat;
  706.         background-size: 100% 100%;
  707.         border-radius: 20px;
  708.     }
  709.            
  710.  
  711.     </style>
  712.  
  713.    
  714.    
  715.     <script type="text/javascript">
  716.  
  717.                 // https://developers.google.com/youtube/iframe_api_reference
  718.  
  719. // global variable for the player
  720. var player;
  721.  
  722. // this function gets called when API is ready to use
  723. function onYouTubePlayerAPIReady() {
  724.   // create the global player from the specific iframe (#video)
  725.   player = new YT.Player('video', {
  726.     events: {
  727.       // call this function when player is ready to use
  728.       'onReady': onPlayerReady
  729.     }
  730.   });
  731. }
  732.  
  733. function onPlayerReady(event) {
  734.  
  735.   // bind events
  736.   var playButton = document.getElementById("play-button");
  737.   playButton.addEventListener("click", function() {
  738.     player.playVideo();
  739.   });
  740.  
  741.   var pauseButton = document.getElementById("pause-button");
  742.   pauseButton.addEventListener("click", function() {
  743.     player.pauseVideo();
  744.   });
  745.  
  746. }
  747.  
  748. var tag = document.createElement('script');
  749. tag.src = "//www.youtube.com/player_api";
  750. var firstScriptTag = document.getElementsByTagName('script')[0];
  751. firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
  752.  
  753. </script>
  754.  
  755.  
  756.     <div id="chatwithme"><div class="charlar">Charlar</div>
  757.     </div>
  758.  
  759. <script defer>
  760. $(function() {
  761.  
  762. new chatangoButton("chatwithme")
  763.  
  764. $("#audiotoggle").click(function() {
  765. console.log("Test")
  766. if($(this).is(".active")) {
  767. $(this).removeClass("active");
  768. $(this).attr("src","https://cdn2.iconfinder.com/data/icons/flat-ui-icons-24-px/24/volume-24-512.png");
  769. var audio = document.getElementById("audio");
  770. audio.play()
  771. } else {
  772. $(this).addClass("active")
  773. $(this).attr("src", "http://freeiconbox.com/icon/256/27150.png");
  774. var audio = document.getElementById("audio");
  775. audio.pause()
  776. }
  777. });
  778. $(".anchorLink").click(function(e){
  779.     e.preventDefault();
  780.  
  781.     $("html, body").animate({
  782.       scrollTop: offset.top
  783.     }, 900);
  784.   });
  785.  
  786. });
  787. </script>
  788.      
  789.  <div id="greet">
  790. <script src="http://pastebin.com/raw/iQLpPgga"></script>
  791. </div>
  792.       <img class="gifanime" src="http://orig07.deviantart.net/5638/f/2016/114/f/2/tumblr_movzsvdsis1sprspwo1_500_by_hekirei-da04f5d.gif">
  793.      <img class="gif1" src="https://24.media.tumblr.com/2663895b747b6f7f4296b3e20a604198/tumblr_muw21cOz2Q1scgxvqo1_500.gif">
  794.       <div class="barranegra"></div>
  795.       <img class="ulquiorra" src="http://images4.fanpop.com/image/photos/21800000/Ulquiorra-ulquiorra-schiffer-21875476-390-638.png">
  796.       <img class="bgazul"src="http://img14.deviantart.net/6cd2/i/2016/120/f/0/yt0snv8_by_hekirei-da0u564.png"/>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!