obrobienie strony www żeby pokazywała tylko pewną jej część

obrobienie strony www żeby pokazywała tylko pewną jej część

Wątek przeniesiony 2024-05-09 11:12 z JavaScript przez Riddle.

marian pazdzioch
  • Rejestracja: dni
  • Ostatnio: dni
  • Postów: 790
0

Gdy wyszukasz w Google hasło "słowo + wymowa" to Google dodaje od siebie fajny element:

  • animowaną dolną część twarzy
  • możliwość "Slow" dla wolniejszej wymowy

Wygląda to tak:
Zrzut ekranu 2024-05-7 o 13.35.35.png
Chciałem ten element wykorzystać (wyłącznie na własny użytek, wiem że to może 1) zniknąć w każdym momencie 2) wyciąganie tego z wyników łamie jakieś tam zasady Google itp.) - a nie jest dostępne przez żadne API Google które znam (sam dźwięk to nie problem, mi chodzi o połączenie tych ruszających się ust z dźwiękiem).

Chciałbym z odpowiedzi która przychodzi do przeglądarki odfiltrować wszystko poza tą zieloną ramką i pokazać tylko to co w zielonej ramce.

Pomysły jak dotąd:

  1. Pierwszy mój pomysł to postawić proxy które będzie wycinać wszystko naokoło zielonej ramki ale nie za bardzo wiem jak zrobić to wycinanie bo tam się dużo dzieje w JS.
  2. Drugi pomysł to poustawiać przeglądarkę w której będę to odpalać tak, żeby ona wycinała pewne elementy www - coś jak działają blokery reklam (można im zdefiniować filtry, tego nie pokazuj, tamtego nie pokazuj)
  3. Trzeci pomysł: udało mi się zescrapować elementy z których składa się ta animacja:
    • mp3 z dźwiękiem
    • obrazki będące sekwencją animacji
      Ale tutaj musiałbym sam to sobie poskładać w animację i jeszcze dorobić funkcję "Slow"
overcq
  • Rejestracja: dni
  • Ostatnio: dni
  • Postów: 402
0

Kod jest zaciemniony: click-listener.png
Ponadto stosują tam coś w rodzaju własnego ‘schedulera’. Dźwięk jest uruchamiany w pierwszym kroku, a następnie są kolejno ustawiane opóźnienia animacji. Stąd widać, że start (i przebieg) animacji jest trochę opóźniony względem dźwięku.

Dane do ramki są pobierane z tego linku:
https://www.google.com/async/callback:699?fc=EswBCowBQUpHOUprUE5fX3Nnejk0QjhmSThQc0RSUTZ1ZDM3VTdxMms1MjR4UWF3TGg2VEx6Z3p4RF91cFhuRnpHQUZMdTNMLTlUdlV0b0Q5NkhSVE1mV2Y2QXQxODlQSzZ2OWlvMF9OUG43NmFwZ0JEcFBXbGV4dDJQb0JSMm1oYzNzU0JXX05TSnljWkhzQWUSF3FGTTZadlRYRjg2STdOWVAyOXlhLUFVGiJBRlhyRWNyQzRfbWVsYnctM196cC0wNkFQWXUtOXRQZ0xn&fcv=3&vet=12ahUKEwj0y5D49_uFAxVOBNsEHVuuBl8Qi9cDegQIDxAO..i&ei=qFM6ZvTXF86I7NYP29ya-AU&opi=89978449&yv=3&cs=0&async=pron_country:gb,pron_lang:en,speed:1,_id:fc_1,_pms:s,_fmt:pc
Wystarczy ;) odkryć, jak generują parametr “fc” i masz własną animację.

Zależy, jak często chciałbyś ładować tę stronę. Jeśli nie sporadycznie, to lepiej zrobić własną animację, ponieważ strona może zostać zablokowana z powodu nadmiarowego ruchu.

Zarejestruj się i dołącz do największej społeczności programistów w Polsce.

Otrzymaj wsparcie, dziel się wiedzą i rozwijaj swoje umiejętności z najlepszymi.