Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

 
Reply to this topicStart new topic
> [JavaScript] Obrazek, Jak uzyskać taki efekt obrazka ?
Adam11
post 27.04.2011, 20:50:12
Post #1





Grupa: Zarejestrowani
Postów: 8
Pomógł: 0
Dołączył: 15.01.2011

Ostrzeżenie: (0%)
-----


Witam wszystkich.

Walczę z efektem wyświetlania obrazka. Działa on gdy najadę na obrazek to on w chmurce powiększony się wyświetla.
Chciałbym następujący efekt uzyskać:



Źródło http://www.kinolive.pl

Patrzałem w kodzie źródłowym tej strony i znalazłem następujące JS:


cookie.js
flash.js
flowplayer-3.1.4.min.js
json.js
prototype.js
tooltip.js

Który JS odpowiada za tą Chmurkę powiększenia ?

Próbowałem takich cudów z każdym JS z tamtej strony dawałem w kod

  1. openside("Top Obrazki");
  2. ?>
  3.  
  4. <link href="http://www.kinolive.pl/stylesheets/main.css" media="screen" rel="stylesheet" type="text/css" />
  5.  
  6. <link href="http://www.kinolive.pl/stylesheets/horinaja.css" media="screen" rel="stylesheet" type="text/css" />
  7.  
  8.  
  9.  
  10. <script src="http://www.kinolive.pl/javascripts/prototype.js" type="text/javascript"></script>
  11. <script src="http://www.kinolive.pl/javascripts/cookie.js" type="text/javascript"></script>
  12. <script src="http://www.kinolive.pl/javascripts/tooltip.js" type="text/javascript"></script>
  13. <script src="http://www.kinolive.pl/javascripts/flowplayer-3.1.4.min.js" type="text/javascript"></script>
  14. <script src="http://www.kinolive.pl/javascripts/cookie.js" type="text/javascript"></script>
  15. <script src="http://www.kinolive.pl/javascripts/flash.js" type="text/javascript"></script>
  16.  
  17. <script src="http://www.kinolive.pl/javascripts/json.js" type="text/javascript"></script>
  18.  
  19.  
  20.  
  21. <script src="http://www.kinolive.pl/javascripts/tooltip.js" type="text/javascript"></script>
  22.  
  23. <h3>Ostatnio komentowane filmy</h3>
  24. <div id="movies_commented_block"><div class="random-block">
  25.  
  26.  
  27.  
  28.  
  29. <div class="left">
  30. <a href="http://www.kinolive.pl/filmy_online/faster-2010-lektor-pl" id="lastcommented-cover-12834"><img alt="okładka" src="http://www.kinolive.pl/system/covers/12834/thumb/7339121.3.jpg?1303587960" height="133" width="100"></a>
  31. <div class="tooltip" id="lastcommented-cover-12834-tooltip" style="border: 1px solid rgb(255, 255, 255); z-index: 5000; position: absolute; top: 2786px; left: 924px; display: none;">
  32. <img alt="7339121" src="http://www.kinolive.pl/system/covers/12834/medium/7339121.3.jpg?1303587960">
  33. </div>
  34.  
  35. </div>
  36.  
  37.  
  38.  
  39.  
  40. <?php
  41. closeside();


I nic mi nie wychodzi.

Przepraszam jeśli napisałem nie w tym dziale.

Pozdrawiam.
Go to the top of the page
+Quote Post
Budzan
post 28.04.2011, 01:17:58
Post #2





Grupa: Zarejestrowani
Postów: 7
Pomógł: 2
Dołączył: 25.04.2011

Ostrzeżenie: (0%)
-----


poszukaj w google Highslide
Go to the top of the page
+Quote Post
Adam11
post 28.04.2011, 19:37:57
Post #3





Grupa: Zarejestrowani
Postów: 8
Pomógł: 0
Dołączył: 15.01.2011

Ostrzeżenie: (0%)
-----


Witam.

Ładne są efekty ale taki jaki ja bym chciał to go nie ma, tylko na klikany obrazek jest.
Chciałbym tak że jak najadę kursorem myszki to on się powiększa jak na tej stronie w/w.

Pozdrawiam.
Go to the top of the page
+Quote Post
Budzan
post 29.04.2011, 08:45:38
Post #4





Grupa: Zarejestrowani
Postów: 7
Pomógł: 2
Dołączył: 25.04.2011

Ostrzeżenie: (0%)
-----


no tak to wystarczy prosta modyfikacja w kodzie. zamiast onclick dać onmouseover
Go to the top of the page
+Quote Post
Adam11
post 29.04.2011, 14:49:06
Post #5





Grupa: Zarejestrowani
Postów: 8
Pomógł: 0
Dołączył: 15.01.2011

Ostrzeżenie: (0%)
-----


Witam Ponownie cool.gif

Skrypcik śmiga aż miło.

Pobrałem paczuszkę i skusiłem się na no-outline.html

Drogi @Budzan jesteś Wielki specool.gif

Tylko moje pytanko brzmi takie:

Czy da radę uzyskać efekt taki jak najadę na obrazek czyli jak wyżej Pan napisał , z tym onmouseover i obrazek się powiększa w "Ramce obok" gdy zjadę z obrazka pierwotnego czyli miniaturki to "Powiększenie znika" ?

Kod mam następujący:

  1. openside("Top Obrazki");
  2. ?>
  3. <script type="text/javascript" src="/javascripts/highslide.js"></script>
  4. <link rel="stylesheet" type="text/css" href="/javascripts/highslide.css" />
  5.  
  6. <script type="text/javascript">
  7. hs.graphicsDir = '';
  8. hs.outlineType = null;
  9. hs.wrapperClassName = 'colored-border';
  10. </script>
  11.  
  12. <div>
  13. <a id="thumb1" href="http://s2.ifotos.pl/img/losnumero_hnnresh.jpg" class="highslide" onmouseover ="return hs.expand(this)">
  14. <img src="http://s2.ifotos.pl/img/losnumero_hnnresh.jpg" alt="Los Numeros"
  15. title="The Best" height="150" width="90" /></a>
  16.  
  17. <div class="highslide-caption">
  18. The Best.
  19. </div>
  20. <?php
  21. closeside();



Pozdrawiam smile.gif

Ten post edytował Adam11 29.04.2011, 14:50:29
Go to the top of the page
+Quote Post

Reply to this topicStart new topic
1 Użytkowników czyta ten temat (1 Gości i 0 Anonimowych użytkowników)
0 Zarejestrowanych:

 



RSS Wersja Lo-Fi Aktualny czas: 8.07.2025 - 08:54