← Wszystkie przykłady

SoundCloud: podświetl kluczowe regiony układu

Obrysowuje główne kontenery SoundCloud przerywaną linią, co ułatwia pisanie własnych styli CSS.

Kod do skopiowania

// Outline key SoundCloud layout regions to help write custom styles
const targets = ['.playControls', '.soundList', '.l-main', '.header', '.sidebarModule', '.playbackSoundBadge'];
targets.forEach(function (sel) {
  document.querySelectorAll(sel).forEach(function (el) {
    el.style.outline = '2px dashed #ff5500';
    el.style.outlineOffset = '-2px';
  });
});

Jak użyć tego przykładu

1. Skopiuj kod przyciskiem powyżej.
2. Zainstaluj JustZix (2 minuty) i otwórz wtyczkę na docelowej stronie.
3. Dodaj nową regułę dopasowaną do tej strony.
4. Wklej kod w panelu JavaScript reguły i zapisz — uruchomi się przy każdym wejściu na stronę.