Ocena wątku:
  • 0 głosów - średnia: 0
  • 1
  • 2
  • 3
  • 4
  • 5
Jak zrobić takie coś animowane przed otwarciem obrazka?
#1
Jak zrobić takie coś animowane przed otwarciem obrazka?
Obrazek,który dużo waży będzie się powoli odsłaniał...
Jak zrobić tak żeby najpierw pojawiła się animacja,odliczanie % lub coś podobnego,a dopiero potem wskoczył cały obrazek ?

Podkreśle,że robie strone w prostym htmlu.
Trzebaby mi to trochę dokładniej wyjaśnić bo jak Ktoś napisze,że np. we flashu to tyle też wiem Tongue
dzięki z góry za pomoc
Odpowiedz
#2
Tak we Flashu, nazywa się to preloader. A w necie poszukaj informacji na temat - moviecliploader

Nawet podam ci adres tutka:
http://www.flashzone.pl/item/2613/Preloader-na-bazie-MovieClipLoader/
Odpowiedz
#3
A właśnie że nie Tongue Robisz to przez LightBox. Bardzo prosta instalacja, nie ma żadnego kombinowania z flashami ani nic z tych rzeczy. Użyłem tego np na tej stronie: http://www.sprzedaztarcicy.pl (w galerii oczywiście) Wystarczy kilka linijek kodu i wszystko działa.

Tutaj http://www.dynamicdrive.com/dynamicindex4/lightbox2/index.htm masz dokładny opis jak takie cuś odpalić, tak jak pisałem wcześniej, jest to bardzo proste ale gdybyś miał jakieś problemy to pisz. Powiem ci co i jak Smile
Odpowiedz
#4
Poddaje się... próbowałem modyfikować tego Light Boxa ,próbowałem z flashem i kaplica...

Powiedzmy,że poniżej to moja strona.Ma sie na niej otwierać [samoistnie,bez klikania i bez zaczerniania reszty strony] jeden duży obrazek zapowiedziany przed całkowitym ściagnięciem przez przeglądarkę takim oto preloaderem - [Obrazek: 2ihqwrs.gif]
Mógłby Ktos wkleić co trzeba tu i tam ? Nie żebym szedł na łatwizne ale stoje ,a nie zrobiłem nawet kroku :/

Kod PHP:
<html>
<
head>
<
meta http-equiv="Content-type" content="text/html; charset=iso-8859-2">
<
title>strona www</title>
</
head>
<
BODY BACKGROUND="images/tlo.jpg">

<
IMG SRC="image/abs.jpg" WIDTH="1200" HEIGHT="900" BORDER="0">

</
body>
</
html
Odpowiedz
#5
Wszystko pisze na stronie którą ci podałem i w readme po ściągnięciu skryptu ale ok Proszę:
1. Pobierasz to:
http://www.dynamicdrive.com/dynamicindex4/lightbox2/lightbox2.03a.zip
2. Foldery CSS, images, js kopiujesz tam gdzie masz swój plik ze stroną czyli np index.html

3. Do sekcji HEAD dodajesz:

Kod:
<script type="text/javascript" src="js/prototype.js"></script>
<script type="text/javascript" src="js/scriptaculous.js?load=effects"></script>
<script type="text/javascript" src="js/lightbox.js"></script>
<link rel="stylesheet" href="css/lightbox.css" type="text/css" media="screen" />

4. Jeżeli jest to jedno zdjęcie na stronie dodajesz do linku do obrazka:
Kod:
rel="lightbox"

Jeżeli więcej to do każdego linku dodajesz:
Kod:
rel="lightbox[roadtrip]"

Przykład dla pojedynczego obrazka:
Kod:
<a href="images/obrazek.jpg" rel="lightbox" title="my caption">Link do obrazka lub tekst</a>

Dla całej galerii:

Kod:
<a href="images/obrazek1.jpg" rel="lightbox[roadtrip]">Link do obrazka lub tekst</a>
<a href="images/obrazek2.jpg" rel="lightbox[roadtrip]">Link do obrazka lub tekst</a>
<a href="images/obrazek3.jpg" rel="lightbox[roadtrip]">Link do obrazka lub tekst</a>

5. Przykładowa strona:


Kod:
<html>
<head>
<meta http-equiv="Content-type" content="text/html; charset=iso-8859-2">
<script type="text/javascript" src="js/prototype.js"></script>
<script type="text/javascript" src="js/scriptaculous.js?load=effects"></script>
<script type="text/javascript" src="js/lightbox.js"></script>
<link rel="stylesheet" href="css/lightbox.css" type="text/css" media="screen" />
<title>strona www</title>
</head>
<BODY BACKGROUND="images/tlo.jpg">

<IMG SRC="image/abs.jpg" WIDTH="1200" HEIGHT="900" BORDER="0" rel="lightbox">

</body>
</html>

Jeżeli dalej czegoś nie wiesz lub nie rozumiesz topisz Smile

EDIT//
Niestety ale wprowadziłem cię w mały błąd. LightBox nie działa na coś takie jak ty chcesz czyli żeby zdjęcie samo się wyświetlało z efektem ładowania. LightBox działa dopiero po kliknięciu. Sad
Rano jak będę miał chwilkę to załatwię ci jakiś skrypt Smile
Odpowiedz
#6
to nie działa.... robie identycznie jak piszesz,robilem też wcześniej i obrazek wyświetla sie normalnie..
testowałem w IE FF Op

edit//
siedzialem nad tym do teraz i poddaje sie ,amen
w Tobie moja nadzieja Sad
Odpowiedz
#7
A w ogóle coś ci się udało zrobić? W IE napewno nie działa. Chodzi o to że ten LightBox działa ale np w taki sposób że dasz jakąś miniaturkę zdjęcia a po kliknięciu wyswietla się duże i to duże właśnie tak fajnie będzie się ładowało czyli np:

Kod:
<a href="images/obrazek_duzy.jpg" rel="lightbox" title="Moja Fotka"><img src="images/obrazek_maly.jpg"></a>

I otrzymujesz taki efekt http://www.sprzedaztarcicy.pl/galeria.html (nie działa na IE)
Rozumiesz?
Odpowiedz
#8
ogólnie to nic mi z tego nie wyszło...obrazek i tak otwierał standartowo
mniejsza o LightBoxa...
w dalszym ciagu chce to [Obrazek: 2ihqwrs.gif]


tu znalazłem kilka w javie ale jak to edytować żeby obrazek był na środku to niewiem... http://www.70.pl/main.php?id=48#15
Odpowiedz


Podobne wątki…
Wątek: Autor Odpowiedzi: Wyświetleń: Ostatni post
  Jak zrobic Formularz Kontaktowy na stronie ? Kodarth 191 255,838 06-04-2021, 16:25
Ostatni post: zerin
  Jak to zrobić. Wyszukiwarka vVPATOLVv 8 7,857 28-03-2017, 11:52
Ostatni post: sskijop
  [HTML] Filmik zamiast obrazka wyróżniającego kuklaale 1 2,759 02-11-2016, 18:36
Ostatni post: martt4dg
  [CSS][HTML] Ustawienie obrazka z boku strony Witek7777 8 8,476 22-09-2016, 01:05
Ostatni post: pocahontas
  Jak to zrobić? Ancik 3 4,439 15-06-2015, 17:33
Ostatni post: mateo

Skocz do:


Użytkownicy przeglądający ten wątek: 1 gości
Sponsorzy i przyjaciele
SeoHost.pl