popup z adresem/linkiem

popup z adresem/linkiem
SW
  • Rejestracja:około 14 lat
  • Ostatnio:ponad 10 lat
  • Postów:126
0

Witam, mam taki problem - za pomocą jq otwieram okno popup, to znaczy do ukrytego diva wczytuje sie zawartosc innego pliku html, po czym div ten sie pojawia i pokazuje treść tamtego html-a, w tym wypadku jest to film. Wyglada to tak:

Kopiuj
 
<script>
$(document).ready(function(){
    $('.right').click(function(){
    var hidden = $('.video_vimeo');
    hidden.css({'display':'block'});
  
    
    hidden.load("vimeo2.html");
  
  
    });
     });
   
   
</script>

<div class="video_vimeo">

    
    
 
  </div>

Wszystko działa, jednak nie ma możliwości odnieść się do tego filmu poprzez link. W pasku wyszukiwarki wyglada to tak ...index.html/# , a chciabym miec link np index.html/film , ktory otwieralby ta strone razem z juz wlaczonym popupem.

Jak to zrobic ?

edytowany 1x, ostatnio: dzek69
dzek69
jesteś na forum już <del>rok</del> <ins>parę lat</ins>. to wciąż problem, żeby kod wstawiać w tagi kolorujące składnię?
szalonyfacet
  • Rejestracja:ponad 12 lat
  • Ostatnio:10 miesięcy
  • Lokalizacja:Dąbrowa Górnicza
0

zostaw tak jak jest (o ile za znakiem hash(#) masz co jeszcze np. index.html#viewVideo) wtedy tylko za pomoca JS sprawdz przy zaladowaniu dokumentu czy hash jest ustawiony na twoja wartosc i wyswietl od razu div z filmikiem.

pamietaj zeby usuwac hash jak zamykasz okno z filmem, wtedy link zwroci strone bez filmiku aktywnego.

SW
  • Rejestracja:około 14 lat
  • Ostatnio:ponad 10 lat
  • Postów:126
0

index.html# <- dokladnie tak wyglada z otwartym divem.

szalonyfacet
  • Rejestracja:ponad 12 lat
  • Ostatnio:10 miesięcy
  • Lokalizacja:Dąbrowa Górnicza
1

no to krok po kroku:

  • wygooglaj jak za pomoca js ustawic hash i sprawdzic jego wartosc
  • ustaw hash za kazdym razem gdy wyswietlasz film
  • usuwaj hash za kazdym arzem gdy zamykasz film
  • sprawdz przy zaladowaniu dokumentu czy twoj hash jest w url i wystwietl popup jesli jest
SW
  • Rejestracja:około 14 lat
  • Ostatnio:ponad 10 lat
  • Postów:126
0

Nie znam sie kompletnie na js, więc juz widzę, że będzie cięzko ;)

Zabieram się do poszukiwań..

Riddle
Administrator
  • Rejestracja:prawie 15 lat
  • Ostatnio:około 14 godzin
  • Lokalizacja:Laska, z Polski
  • Postów:10076
1

Pozwoliłem sobie sformatować Twój kod.

Kopiuj
$(document).ready(function(){
    $('.right').click(function(){
    var hidden = $('.video_vimeo');
    hidden.css({'display':'block'});
 
 
    hidden.load("vimeo2.html");
 
 
    });
     });
 
 

->>

Kopiuj
$(function(){
    $('.right').click(function(){
        $('.video_vimeo').css("display", "block").load("vimeo2.html");
    });
);
edytowany 1x, ostatnio: Riddle
SW
  • Rejestracja:około 14 lat
  • Ostatnio:ponad 10 lat
  • Postów:126
0

Niestety nie wychodzi mi to tak jak powinno, jeśli ktos ma bardziej konkretne rozwiązania to prosze o pomoc :)

dzek69
Moderator
  • Rejestracja:ponad 18 lat
  • Ostatnio:około miesiąc
  • Lokalizacja:Rzeszów
0

jest takie coś jak prettyPhoto - plugin galeri do jQuery. posiada on obsługę deep linking oraz linków vimeo z tego co pamiętam. sprawdź sobie czy się nada


SW
dzięki, zaraz to sprawdzę :) widzę w demie, że przy zdjęciach działa tak jak chcę, więc jestem dobrej myśli.
SW
  • Rejestracja:około 14 lat
  • Ostatnio:ponad 10 lat
  • Postów:126
0
Kopiuj
<script>
$(document).ready(function(){
    $('.right').click(function(){
    var hidden = $('#video_vimeo');
    hidden.css({'display':'block'});
  });
     });
 
 
</script>

<script>

$(document).ready(function(){
 var l = document.location;
    var hash = (l.hash) ? ''+l.hash : '';

    


if(hash == "#video_wyglad"){

var hidden = $('#video_wyglad');
    
    hidden.css({'display':'block'});
  
    
    

}
 else{

  var hidden = $('#video_wyglad');
    
    hidden.css({'display':'none'});

    

}




});

</script>
Kopiuj
<div id="video_vimeo">
 
 
 <!-- tresc diva razem z filmem -->
<!-- button close z a href, ktory przekierowuje z powrotem na str główna wraz z odświeżeniem strony żeby nie bylo slychac filmu w tle jak mialo to miejsce przy zmianie samego display popupu -->
 
  </div>

<a class="right" href="#video_vimeo"></a>

Zrobiłem to na około trochę, po kliknieciu na link pojawia się adres w przeglądarce np. index.html#video_vimeo. Dodatkowo dodałem skrypt, który sprawdza wartość hash przy wczytywaniu strony, jeśli wartość ta równa się właśnie #video_vimeo to zmienia display ukrytego diva na block.

Ogólnie nawet to funkcjonuje, problem jest tylko wtedy gdy ktoś zamiast przycisku close chce uzyc przycisku WSTECZ w przeglądarce ;)

edytowany 2x, ostatnio: SzeWa
dzek69
Moderator
  • Rejestracja:ponad 18 lat
  • Ostatnio:około miesiąc
  • Lokalizacja:Rzeszów
0

dopisz sobie skrypt, który Ci co 250ms (częściej nie ma potrzeby) sprawdza czy zmienił się hash (nie ma [albo nie było rok temu] eventu na to), i jeżeli tak - ukrywasz diva.


szalonyfacet
  • Rejestracja:ponad 12 lat
  • Ostatnio:10 miesięcy
  • Lokalizacja:Dąbrowa Górnicza
0

button close z a href, ktory przekierowuje z powrotem na str główna wraz z odświeżeniem strony żeby nie bylo slychac filmu w tle jak mialo to miejsce przy zmianie samego display popupu

ja tylko do tego dodam, ze przechowuj sobie adres filmu w zmiennej i zamiast odswiezac cala strone to czysc ten adres z src iframe lub z taga video lub z czego ty tam wczytujesz to wideo. nie bedzie dzwieku w tle i nie bedziesz odswiezal strony.

edytowany 1x, ostatnio: szalonyfacet
B7
  • Rejestracja:prawie 15 lat
  • Ostatnio:ponad 8 lat
0

A ja dorzucę mały artykulik, może pozwoli poprawić umiejętności JS: http://webhosting.pl/Jak.zmieniac.elementy.URL_a.w.JavaScripcie


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.