Odporny licznik

Admin — Wed, 30 Oct 2024 22:41:00 +0100

Prosty licznik odwiedzin, który zliczałby 1 wejście w ciągu jednej doby 1 osoby

<?php ob_start(); ?>
<html>
<head>
</head>
<body>
<?php
/* --- OPERACJA NA CIASTECZKACH, DODAJEMY WARTOŚCI */
/* warunek: jeżeli nie ma ciasteczka w pamięci przeglądarki o nazwie licznik_cook, z wartością 1 to: */
if(!$_COOKIE['LicznikCook']){

/* jeżeli plik z bazą danych (licznik.db) istnieje i jest zapisywalny (chmod: 666), to: */
if(file_exists("licznik.db")){
	if(is_writeable('licznik.db')){

	/* pobieramy zawartość tego pliku i podwyższamy jego wartość, np. z 34 na 35 */
	$bdpobierz = file_get_contents("licznik.db") + "1";

	/* otwieramy plik licznik.db - bazę danych */
	$bdzapisz = fopen("licznik.db", "w");

	/* nadpisujemy istniejącą wartość na tą ze zmiennej $bdpobierz, następnie zamykamy */
	fwrite($bdzapisz, $bdpobierz);
	fclose($bdzapisz);
	}
}

/* wysyłamy przeglądarce ciasteczko o nazwie licznik_cook, z wartością 1 (przykładowa wartość) oraz ustawiamy jego ważność na 24 godziny */
setcookie("LicznikCook", '1', time()+3600*24);
}

/* --- WYŚWIETLAMY ILOŚĆ ODWIEDZIN */
/* sprawdzamy, czy plik bazy danych istnieje */
if(file_exists("licznik.db")){

	/* sprawdzamy, czy plik bazy danych jest zapisywalny (666) */
	if(is_writeable('licznik.db')){

		/* pobieramy plik */
		$bdpokaz = file_get_contents("licznik.db");

		/* wyświetlamy zawartość, czyli ilość odwiedzin */
		echo "Licznik odwiedzin: $bdpokaz".'.<br/><br/>';

		/* jeżeli plik nie jest zapisywalny wyświetlamy komunikat o błędzie: */
		}else{echo "Plik nie jest zapisywalny. Ustaw chmody na 666.";}

}else{echo "Plik nie istnieje. Utwórz plik licznik.db i wgraj go na serwer.";}

?>
</body>
</html>

Efekt input v2

Admin — Thu, 24 Nov 2022 13:27:00 +0100

Samopiszący się input...

Ciekawy input

<form name="form" action="#">
  <div class="form">
    <input type="text" name="text" required placeholder="Imię" autocomplete="off">
    <input type="text" name="text" required placeholder="Nazwa użytkownika" autocomplete="off">
    <input type="password" name="password" required placeholder="Hasło" autocomplete="off">
    <input type="submit" class="button" title="Zapisz" value="Wyślij">
  </div>
</form>
 
<script>
    solid();
</script>

aktualna opcja efektów

solid()
gradient()
sections()
flash()

Przypięty div

Admin — Tue, 22 Nov 2022 13:07:00 +0100

Prosty sposób na przypięcie div

index.php

<div id="motyw"> 
tekst
</div>

style.css

   #motyw {
    position: fixed;
    left: 1%;
    top: 95%;
    margin: -2.5em 0 0 0;
    z-index: 5;

Tło pod footer

Admin — Tue, 22 Nov 2022 12:47:00 +0100

Prosty sposób na tło tylko pod footer

footer.php

<footer  class="zielony">
stopka
<footer>

style.css

.zielony{
  max-width:100%; 
  background-color: #89AD90;
    opacity: 0.8;
  color: #484848;  
  padding: 60px 15px 60px 15px;
  clip-path: polygon(0 20%, 100% 0, 100% 100%, 0% 100%);
  margin-top: -10px;
}

Przypiety footer

Admin — Tue, 22 Nov 2022 12:26:00 +0100

Prosty sposób na footer czyli inaczej stopkę która będzie zawsze przypięta do dolnej części strony.

footer.php

<footer id="stopka">
stopka
</footer>

style.css

 #stopka {
	position: fixed;
	height: 40px;
	bottom: 0;
	width: 100%;
}

Przypięte lubię to

Admin — Sat, 27 Feb 2021 13:31:00 +0100

Przypięty div na stronie

 <style>
            
            #TopBarww{
                position: fixed;
                top: 85%;
                left: 2px;
                margin:15px;
                z-index:1;
                box-shadow:0px 00px 10px silver;
                background-color: transparent;
				background-image: none;
            }
</style>


 


       <div id="TopBarww">
            <a href=""><div id="fb-root"></div>
<script>(function(d, s, id) {
  var js, fjs = d.getElementsByTagName(s)[0];
  if (d.getElementById(id)) return;
  js = d.createElement(s); js.id = id;
  js.src = 'https://connect.facebook.net/pl_PL/sdk.js#xfbml=1&version=v3.0';
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
<div class="fb-like" data-href="https://www.facebook.com/Plywak4Style" 
data-layout="box_count" data-action="like" 
data-size="small" data-show-faces="true" data-share="falsh"></div>
</a> 
       </div>

Przypięte menu

Admin — Fri, 26 Feb 2021 20:13:00 +0100

html

<ul id=menu>
<li><a href="">Sekcja 1</a>
<li><a href="">Sekcja 2</a>
<li><a href="">Sekcja 3</a>
</ul>

css

#menu {
  position: fixed;
  right: 0;
  top: 80%;
  width: 1em;
  margin-top: -1.5em;
}

Konsola w przeglądarce

Admin — Fri, 26 Feb 2021 19:48:00 +0100

Konsola napisana w CSS i JS

html

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <title>JS Bin</title>
</head>
<body>
  <div class="console">
    <pre class="typing">$ </pre>
  </div>
</body>
</html>

css

.typing::after {
  content: '_';
  animation-name: blink;
  animation-duration: 1s;
  animation-iteration-count: infinite;  
}

.typing::before {
  content: 'SYSTEM KODUJE';
  display: block;
}

@keyframes blink {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

.typing {
  color: #34d834;
}
.console {
  background: black;
  height: 200px;
  border: 3px solid silver;
  border-top-width: 20px;
  position: relative;
  padding: 10px;
  border-radius: 3px;
}

.console::after {
  content: '';
  width: 10px;
  height: 10px;
  font-size: 10px;
  position: absolute;
  top: -15px;
  left: 1px;
  border-radius: 50%;
  background: red;
  display: flex;
  justify-content: center;
  align-items: center;
}

.console::before {
  content: '';
  width: 10px;
  height: 10px;
  font-size: 10px;
  position: absolute;
  top: -15px;
  left: 15px;
  border-radius: 50%;
  background: orange;
  display: flex;
  justify-content: center;
  align-items: center;
}

var typing = document.querySelector('.typing'),
    currentIndex = 0;

var startTyping = function (text) {
  
  interval = setInterval(function(){
      if (text.length > currentIndex) {
        typing.textContent += text[currentIndex];
        currentIndex++;
      } else {
        clearInterval(interval);
      } 
  },100);
}

startTyping("tekst do wyświetlenia");