Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: JCrop - Dynamiczna miniaturka?
Forum PHP.pl > Forum > Po stronie przeglądarki
nait
Witam!
Pracuje nad hmm małym panelem pod jedną z moich stron i chcę dodać możliwość przycinania obrazków. W tym celu użyłem JCrop. Dostosowałem już go pod siebie aczkolwiek chciałem dodać jeszcze podgląd miniatury i tu pojawia się problem.
W prawdzie jest tego przykład: http://deepliquid.com/projects/Jcrop/demos...?demo=thumbnail, ale ja potrzebuję trochę trochę innego działania, a że nie znam się na js w ogóle to mam spory problem z tym :/

Nie chcę żeby miniaturka miała stały wymiar jak w przykł, 100px. Chcę aby powiększała się dynamicznie wraz z powiększeniem się zaznaczenia. Usunę wymiary diva to podgląd szaleje, więc jak spekuluje to div
  1. <div style="width:100px;height:100px;overflow:hidden;">
  2. <img src="demo_files/pool.jpg" id="preview" alt="Preview" class="jcrop-preview" />
  3. </div>

w którym znajduję się podgląd musiałby jakoś pobierać wysokość i szerokość z funkcji zaznaczenia?tongue.gif Albo coś w ten deseń. Mógłby ktoś pomóc jak to zrobić? Z góry dziękuje
krispak
Prosze bardzo, wystarczy zastosowac/podmienic u siebie wink.gif
[JAVASCRIPT] pobierz, plaintext
  1. function updatePreview(c)
  2. {
  3. var bounds = this.getBounds()
  4. if (parseInt(c.w) > 0)
  5. {
  6. var rx = bounds[0];
  7. var ry = bounds[1];
  8.  
  9. $('#divPreview').css({
  10. width: c.w,
  11. height: c.h,
  12. display: 'block'
  13. });
  14.  
  15. $('#imgPreview').css({
  16. position: 'absolute',
  17. top: '-' + Math.round(c.y) + 'px',
  18. left: '-' + Math.round(c.x) + 'px'
  19. });
  20. }
  21. };
[JAVASCRIPT] pobierz, plaintext

  1. <div style="margin: 0 auto; position: relative; overflow:hidden; display:none;" id="divPreview" >
  2. <img src="demo_files/pool.jpg" alt="Preview" class="jcrop-preview" id="imgPreview" />
  3. </div>
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.