Twoje PC  
Zarejestruj się na Twoje PC
TwojePC.pl | PC | Komputery, nowe technologie, recenzje, testy
B O A R D
   » Board
 » Zadaj pytanie
 » Archiwum
 » Szukaj
 » Stylizacja

 
M E N U
  0
 » Nowości
0
 » Archiwum
0
 » Recenzje / Testy
0
 » Board
0
 » Rejestracja
0
0
 
Szukaj @ TwojePC
 

w Newsach i na Boardzie
 
OBECNI NA TPC
 
 » Pietka 07:50
 » mravel 07:50
 » Sherif 07:49
 » rooter666 07:48
 » Irix 07:46
 » Logic-3 07:43
 » kyusi 07:40
 » wukillah 07:40
 » JE Jacaw 07:33
 » Kelso1 07:31
 » ghost12 07:18
 » Zbyl 07:16
 » Fox 07:14
 » steve 07:11
 » mo2 06:57
 » AfiP 06:56
 » XepeR 06:43
 » PeKa 06:30
 » cVas 06:23
 » KHot 06:19

 Dzisiaj przeczytano
 22509 postów,
 wczoraj 72839

 Szybkie ładowanie
 jest:
włączone.

 
ccc
TwojePC.pl © 2001 - 2026
A R C H I W A L N A   W I A D O M O Ś Ć
    

[html/js/jquery/css/?] Ładowanie obrazków a'la galeria na allegro (ta w nowym oknie) , Soulburner 30/01/10 14:36
Z góry zaznaczam, że z js nie miałem nigdy nic wspólnego, a strony robię sobie raz na pięć lat i to bez php - mój post może się wydać więc śmieszny, że nie wiem takiego banału ;) Ale do rzeczy.

Dłubię sobie pewną stronkę i chcę nań zrobić tak, że na stronie siedzi <div>, w którym ma znajdować się powiększone zdjęcie. Poniżej są sobie miniaturki z linkami do zdjęć, które to mają ukazywać się duże w powyższym divie.

Pierwotnie skorzystałem z tego: http://i-code.co.uk/javascript/imageviewer.php - jednak zdjęcia się trochę czasu ładują, przez co odwiedzający może się pogubić i nie wiedzieć, czy kliknął miniaturkę, czy nie, a może strona zepsuta i nie działa :P

Potrzebny jest więc jakiś animowany gif wskazujący na to, że coś się ładuje - np. udający pasek postępu. Miałoby to być coś na wzór galerii allegro powiększonej w nowym oknie.


Znalazłem takie coś używającego JQuery (które już na stronie jest użyte do czego innego, więc czemu by nie wykorzystać więcej):
<script language="javascript">
function example_request()
{
$('#container').html('<p><img src="ajax-loader.gif" width="16" height="16" /></p>');
$('#container').load("plik.html");
}
</script>

<input type="button" onclick="example_request()" value="Click" />

<div id="container">
<p>Jakiś głupi tekst</p>
</div>

To nawet działa, tylko... jeśli zamiast plik.html (zawierający jeden paragraf <p>ple ple ple</p>, czyli całość podmienia tylko linijkę tekstu) chcę użyć jakiegoś obrazka... pokazuje się on w formie czystego tekstu :P

Czy ktoś z Was mógłby poratować i podpowiedzieć lub poczęstować gotowym skryptem, który zrobi to, co chcę? :) Z góry dzięki.

PS - nie, to nie jest zadanie ze szkoły ;)

You must gather your party before
venturing forth.

  1. jak zrobisz tak , kubazzz 30/01/10 15:37
    $('#container').html('<img src="bigphoto_x.jpg />');

    to nie będzie to co chcesz?

    SM-S908

    1. nie bardzo , Soulburner 30/01/10 20:33
      zaletą load jest to, że pokaże co załadowało dopiero jak się załaduje, dzięki czemu linijka wyżej ma sens (czyli pokazany gif ma szansę się poanimować). Stosując Twoją linijkę, gif natychmiast zostaje zastąpiony bigphoto.jpg.

      You must gather your party before
      venturing forth.

  2. proste , Grocal 30/01/10 17:48
    [ http://www.grocal.pl/temp/test/ ]

    Na pewno, na razie, w ogóle...
    Naprawdę, naprzeciwko, stąd...
    Ortografia nie gryzie!

    1. e, ale gdzie tu , Soulburner 30/01/10 20:25
      jakiś progress bar? :P To działa podobnie do sposobu podanego w linku z mojego posta ;)

      You must gather your party before
      venturing forth.

    
All rights reserved ® Copyright and Design 2001-2026, TwojePC.PL