Skocz do zawartości

Statystyki forum z pulsującym border-bottom MyBB


ferNx
 Udostępnij

Rekomendowane odpowiedzi

Witam , mam taki problem a mianowicie podobają mi się pewne statystyki pewnej sieci i chciałbym zrobić sobie z podobnym efektem tylko nie mam pojęcia jak ;/ 

Link do forum ze statystykami: https://wyjasniamy.eu/forum/

Screen: https://scr.hu/kXR92y

Chodzi  mi, żeby border-bottom pulsował tak jak na forum powyżej.

Prosiłbym o pomoc :> Z Góry Dziękuje ☺️

Odnośnik do komentarza
Udostępnij na innych stronach

  • Ekspert

Poczytaj o takiej animacji jak pulse (pulse animation css3) i spróbuj coś sam skleić, a jeżeli chcesz gotowca to wejdź na forum wyjaśniamy.eu  kliknij prawy przycisk myszy  zbadaj element / zbadaj  a następnie odnajdź klasę .pulse i inteligentnie skopiuj CSS

Edytowane przez rogue
Odnośnik do komentarza
Udostępnij na innych stronach

Godzinę temu, rogue napisał:

Poczytaj o takiej animacji jak pulse (pulse animation css3) i spróbuj coś sam skleić, a jeżeli chcesz gotowca to wejdź na forum wyjaśniamy.eu  kliknij prawy przycisk myszy  zbadaj element / zbadaj  a następnie odnajdź klasę .pulse i inteligentnie skopiuj CSS

Ja tutaj widzę, że to gotowy obrazek gif. Co ma się chłopak przemęczać z kopiowaniem kodu, jeszcze źle wklei i popsuje wygląd swojego forum.

Odnośnik do komentarza
Udostępnij na innych stronach

@rogue inteligentne skopiowanie css .pulse nic nie da mistrzu:) probowalem.

@ShanonWEB  to zle widzisz obrazek .gif sa tylko na belkach zrobione a nie na elemencie, ktory zaznaczyłem:)

P.S Prosiłem czy ktoś moglby wykonac dla mnie te statystyki a nie opisanie co to jest. A jezeli tak zrozumiales Panie @ShanonWEB to nie wiem za co i po co masz range support jezeli w ten sposob mi ani troche nie pomagasz.

Odnośnik do komentarza
Udostępnij na innych stronach

6 godzin temu, `ferN napisał:

@rogue inteligentne skopiowanie css .pulse nic nie da mistrzu:) probowalem.

@ShanonWEB  to zle widzisz obrazek .gif sa tylko na belkach zrobione a nie na elemencie, ktory zaznaczyłem:)

 

P.S Prosiłem czy ktoś moglby wykonac dla mnie te statystyki a nie opisanie co to jest. A jezeli tak zrozumiales Panie @ShanonWEB to nie wiem za co i po co masz range support jezeli w ten sposob mi ani troche nie pomagasz.

Zawsze jesteś taki arogancki? Pomyliłem temat, zdarza się.

Odnośnik do komentarza
Udostępnij na innych stronach

Spoiler

@keyframes pulse {
  0% {
    opacity: 0;
    transform: scale(0);
  }
  8% {
    opacity: 0;
    transform: scale(0);
  }
  15% {
    opacity: 1;
    transform: scale(0.1);
  }
  30% {
    opacity: 1;
    transform: scale(0.5);
  }
  100% {
    opacity: 0;
    transform: scale(1);
  }
}
@keyframes pulse {
  0% {
    opacity: 0;
    transform: scale(0);
  }
  8% {
    opacity: 0;
    transform: scale(0);
  }
  15% {
    opacity: 1;
    transform: scale(0.1);
  }
  30% {
    opacity: 1;
    transform: scale(0.5);
  }
  100% {
    opacity: 0;
    transform: scale(1);
  }
}
.pulse {
  animation: 2s linear 0s normal none infinite running pulse;
  background-color: transparent;
  border-bottom: 2px solid #ff9497;
  border-image: initial;
  box-shadow: 0 0 26px 0 rgba(255, 148, 151, 1);
  height: 1px;
  margin: 0 auto -9px;
  opacity: 0.1;
  position: relative;
  width: 100%;
  z-index: 10;
}

 

Odnośnik do komentarza
Udostępnij na innych stronach

Problem wciąż nierozwiązany? Dodaj swoją odpowiedź

Jeśli chcesz dodać odpowiedź, zaloguj się lub zarejestruj nowe konto. Jedynie zarejestrowani użytkownicy mogą komentować zawartość tej strony.

Zarejestruj nowe konto

Załóż nowe konto. To bardzo proste!

Zarejestruj się

Zaloguj się

Posiadasz już konto? Zaloguj się poniżej.

Zaloguj się
 Udostępnij

×