Wideo na stronie z opcją wyboru minitaturki


(Discochaos) #1

Witam!

Mam pewien problem - szukam pomysłu jak rozwiązać kwestie filmów na stronie. Strona jest html.

Chciałbym mieć możliwość takiego udostępnienia filmów które domyślnie będą zamieszone na vimeo (lub youtube)

Chodzi o to żeby po wybraniu miniaturki nr 1 prawej strony do okienka po lewej stronie ładował się filmik 1, po wybraniu miniaturki 2 filmik 2 itp.

Ma ktoś może jakiś pomysł? Niestety widgety vimeo nie radzą sobie z tym

prod.jpg


(ziggurad) #2

Masz dwa rozwiązania:

  1. Statycznie - po kliknięciu w “1” strona przeładowuje się na podstronę z filmem nr 1.

  2. Dynamicznie za pomocą javascriptu - przechwytujesz klik w “1” i w “dużym oknie” wrzucasz kod z yt przez javascripta. Albo masz tam divy z każdym filmem i odpowiedni pokazujesz a inne ukrywasz.


(Discochaos) #3

mógłbyś rozwinąć wątek? byłbym b. wdzięczny


(ziggurad) #4

Co tu rozwijać? Co nie jest jasne?

Podałem Tobie dwa możliwe rozwiązania, musisz wybrać jedno i je napisać.


(Discochaos) #5

to dla mnie nie jest jasne, może wiesz gdzie mógłbym znaleźć tutorial do takiego wykonania? wybacz ale z jscript nie jestem za pan brat :wink:


(ziggurad) #6

Np:

W htmlu w oknie z filmem wrzucasz sobie kilka divów gdzie każdy ma klase film inne id np film1 i pierwsze diva zostawiasz a reszte ukrywasz np za pomocą: cssa display none. Później po prawej stronie wstawiasz sobie linki z obrazkami, linki mają klasę np “linkFilm” i id linkFIlm1, do strony podpinasz jquery i piszesz coś w stylu:

$('a.linkFilm').click(function(){

    $('div.film').css('display', 'none');

    id=$(this).attr('id');

    id=id.substringData(8);

    $('#film'+id).css('display','block');


})
  1. Ukrywasz wszystkie divy

  2. Pobierasz id klikniętego a

  3. Pobierasz sam numer

  4. Pokazujesz odpowiedniego diva

Pisane z palca.

Poczytaj trochę o js.