Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [PHP][JavaScript]auto tworzenie minaturek obrazka w formularzu
Forum PHP.pl > Forum > Przedszkole
piekloniebo
Witam,
Czy ktoś może wie gdzie mogę znaleźć klasę albo jakiegoś tutoriala jak zrobić w formularzu automatyczne wgrywanie obrazka i tworzenie jego miniaturki jeszcze przed naciśnięciem
"submit".

Coś takiego jak ma allegro.
Chciałbym to zaimplementować w moim skrypcie ale nie mogę znaleźć opisu i kodu.


Tu wstawiam linka do przykładowej strony z "płatnym rozwiązaniem", które oczywiście mnie nie interesuje bo jest płatne...

auto create



Pozdrawiam,
Darek
kipero
Chyba nie ma opcji, żeby wygenerować i wyświetlić miniaturę pliku z dysku, bez jego wysyłania. W podanym przez Ciebie przykładzie plik jest uploadowany w tle z użyciem AJAXa i to serwer generuje miniaturę.

Poczytaj: http://www.ajaxf1.com/tutorial/ajax-file-u...d-tutorial.html
piekloniebo
Dzięki za odp.
no tak mi się wydawało. Bo php nie wykona żadnej operacji przed naciśnięciem submit, rajt?

Więc chyba przegogluję net teraz w poszukiwaniu rozwiązania "ajax + php auto upload"....

pewnie jakiś javascript onChange w polu file też może to obsługiwać...

Jakbyś może miał w głowie jakiś link do jakiego tutoriala albo scryptu który będę mógł sobie porozkmilać to będę wdzięczny....




Dobra cofam nie zauważyłem twojego linku...
Już otworzyłem...
Dzięki za pomoc....
Pawel_W
ehh wcale nie jest powiedziane że to musi być ajax albo php - wystarczy zwykły javascript image resizer - sprawdzasz czy wartosc pola file zostala zmieniona, a jak tak to tworzysz w js new Image, podajesz jako src wartosc pola i pobierasz wymiary ;]

EDIT:
tu masz pełny kod:
  1. <script type="text/javascript">
  2. function miniatura(obj)
  3. {
  4. var img = new Image();
  5. img.src = obj.value;
  6. w = img.width;
  7. h = img.height;
  8.  
  9. maxx = 500; // maksymalna szerokosc miniaturki
  10. maxy = 500; // maksymalna wysokosc miniaturki
  11.  
  12. if(w > maxx && h > maxy)
  13. {
  14. hx = h / maxy;
  15. wx = w / maxx;
  16.  
  17. if(hx > wx)
  18. {
  19. w = h/hx;
  20. h = w/hx;
  21. }
  22. else
  23. {
  24. h = h/wx;
  25. w = w/wx;
  26. }
  27. }
  28. image_obj = document.getElementById(obj.name);
  29. image_obj.src = obj.value;
  30. image_obj.style.width = w+"px";
  31. image_obj.style.height = h+"px";
  32. image_obj.style.display = "block";
  33. obj.style.display = "none";
  34. }
  35. <img src="" id="image1" style="display: none">
  36. <input type="file" onchange="miniatura(this)" name="image1">
piekloniebo
naszperałem się cały dzień po necie a tu się okazuje że w Firefoxie nie ma możliwości zrobienia autopodglądu lokalnych plików.
No to chyba to odpuszczam.
Jest trochę rozwiązań na necie i twoje Pawel to z Javascriptem tez jest ok ale w Firefoxie mi nie śmiga a chciałbym na stronie miec uniwersalne rozwiązania.
Dzięki za pomoc mimo wszystko....

Chyba że jestem w błędzie.
Jeżeli ktoś zna uniwesalne rozwiązanie które działa w Explorerze i Firefoxie to niech wrzuci linka do kodu.

Pozdrawiam,
Darek
erix
Cytat
Jest trochę rozwiązań na necie i twoje Pawel to z Javascriptem tez jest ok ale w Firefoxie mi nie śmiga a chciałbym na stronie miec uniwersalne rozwiązania.

Zostaje wysłanie na serwer pełnego pliku i wyświetlanie via prosty img, który docinasz...
piekloniebo
Ale właśnie sprawdziłem na allegro i działa u nich ładowanie automatyczne. Czy ktoś wie jakie to jest rozwiązanie. Pewnie jakiś javascript. Jeżeli ktoś wie gdzie można znaleźć taki kod do zaadoptowania to niech wstawi linka.
Ja pracuję aktualnie nad takim kilkuetapowym formularzem dodawania produktu do sklepu.
Jedna ze stron ma dodać dwa zdjęcia produktu.
Chciałbym żeby osoba która kliknie guzik dodaj zdjęcie i wybierze plik miała w ciągu kilku sekund możliwość obejrzenia miniaturki dodanego zdjęcia.

Tak się dzieje na allegro.
Przy guziku dodaj zdjęcie jest adnotacja (zdjęcie załaduje się automatycznie w ciągu kilku sekund) i tak się dzieje niezaleznie od przelądarki. Również w firefoxie to działa. Sprawdziłem..


Pozdrawiam,
Darek
erix
Cytat
Ale właśnie sprawdziłem na allegro i działa u nich ładowanie automatyczne. Czy ktoś wie jakie to jest rozwiązanie. Pewnie jakiś javascript. Jeżeli ktoś wie gdzie można znaleźć taki kod do zaadoptowania to niech wstawi linka.

Nie wiem, jak jest na allegro, ale rozwiązanie jest iście diabelskie: w tle jest tworzona ramka i na nią ustawiany jest target formularza, w którym wybierasz obrazek. [;
piekloniebo
Znalazłem coś takiego z użyciem Ajax:
AJAX FILE UPLOAD
dr_bonzo
Kilkuetapowe dodawanie produktu do sklepu?

Na samym poczatku utworz produkt (na razie "nieskonczony" i ukryty) i wtedy wszystko mozesz sobie ladnie dodawac.
Na koniec usuwasz (wraz z fotkami i miniaturkami) lub zapisujesz ten produkt.

A co do samego uploadu: http://swfupload.org/ - wymaga flasza, ale daje ci mozliwosc jednorazowego zaznaczenia wielu plikow + progressbar.
To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.
Invision Power Board © 2001-2025 Invision Power Services, Inc.