Homepage von Basti1012 = ,loesungen ,Hauptmenü

< >
request-ladebalken.php

Quell Code

 
<style>
    * {
            padding: 0;
            margin: 0;
        }

 
span{
border:2px solid red;
padding:5px;
height:30px;
width:555px;
margin:6px;
}
</style>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script> 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>   
<link rel="stylesheet" media="all" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
</head>
<body>
 
<main>
 
<h5>Klicke auf die Links mit der unterschiedlichen größen</h5>
<span data-wert="bild1.html">Datei 1 Laden (  ca  400kb  )</span><br><br><br>
<span data-wert="bild2.html">Datei 2 Laden ( ca  8000 kb    )  Dauert etwas !!</span><br><br><br>
<span data-wert="bild3.html">Datei 3 Laden ( ca  1 kb    )</span>


</main>
<script>
$(document).ready(function() {

    $("span").click(function() {
document.getElementById('body1').style.display='block';
    g=Date.now();

    link=$(this).data('wert');
    $.ajax({
      type: "POST",
          url: link+'?=timestamp='+g,
          success: function(data){   
               $('#seiteninhalt_laden').text('<p>'+data+'</p>');
               document.getElementById('body1').style.display='none';
         }
     })
    
    });
});
</script>
 
 
</body>
</html>