jQuery Resize div da pulsante o campo input

[wakeinvisible]

Salve a tutti ragazzi e veterani di Html.it, sono nuovo registrato ma un'assiduo sostenitore e visitatore della community , mi chiamo Giovanni.

Sono qui ora per chiedervi un aiuto in un problema nella quale mi sono imbattuto, in pratica dovrei realizzare uno script dove da "Pulsante" o "campo input" dovrebbe far ridimensionare un div o immagine a mio piacere, quindi se da pulsante deve avere una dimensione da me predefinita se da campo input deve essere a piacere dell'utente ma ovviamente con un limite margine (es. 30 ~ 46 ).

Fino ad ora ho provato cosi, sbirciando soluzioni dal sito ufficiale jquery:

Script:

<script>
$(document).ready(function() {
$('#clickme').click(function() {
  $('#piede').animate({
    height: '+:50px'
  }, 5000);
});
});
</script>

Html:

<div id="clickme" style="cursor:pointer;">
  Click here
</div>
<div id="piede" style="position:relative; height:800px; width:450px;">
[img]Personal Ultra Avanzato 1 Files/img/piede.png[/img]
  </div>

Chiaramente questo è solo un'esempio, ho inserito come esempio "piede" perchè una volta capito il sistema dovrò realizzare la pagina vera e propria, e avendo iniziato a studiare jquery solo da qualche giorno sto avendo i soliti problemi da principiante e quindi... lo script non funziona.

Ps. Premetto che: Ho già provato a sostituire gli apici "#piede" con '#piede', ovviamente sottointendo che nella pagina sono già associati gli script jquery180.min.js e compagnia bella.

Ora vado di pietà: Per favoreee aiutatemiiiii

[cavicchiandrea]

Ciao e benvenuto, pietà e "piagnistei" non ti fanno onore d'altronde tutti quando iniziano hanno difficoltà a capire jquery (e quando non si ha buone basi di js è anche peggio) detto questo cosa vorrebbe essere questo height: '+:50px' (sopratutto i : a cosa servirebbero?) in oltre se "restringi" un contenitore (in questo caso un div) e non restringi il contenuto (in questo caso l'immagine) tutti i tuo sforzi potrebbero essere vani alcuni browser se il contenuto è più grande del contenitore adattano quest'ultimo e/o non restringono (il concetto se un immagine 500 x 500 non la posso mettere in un contenitore 400 x 400)

[wakeinvisible]

Ciao andrea e grazie per avermi risposto cosi tempestivamente , per quanto riguarda il +:50px l'avevo letto da qualche parte che ora non ricordo, ora ho sistituito il valore con un valore assoluto inoltre ho dato l'id all'immagine direttamente anzichè al div solo che il problema persiste lo stesso

Script aggiornato:

<script>
$(document).ready(function() {
$("#clickme").click(function() {
  $("#animate1").animate({
    height: "50px", 
    width: "50px", 
  }, 1000);
});
});
</script>

Html aggiornato:

<div id="clickme" style="cursor:pointer;"> Click here </div> <div style="position:relative; height:800px; width:450px;"> [img]Personal Ultra Avanzato 1 Files/img/piede.png[/img] </div>

Soluzioni?

[cavicchiandrea]

width: "50px", <-- la virgola non ci va nell'ultimo parametro serve solo da separatore tra due attributi, attenzione che forzando il restringimento di larghezza e altezza potresti distorcere l'immagine se fossi in te ripasserei le guide (js e jquery)

[wakeinvisible]

Ho già rimosso quella virgola ma il problema persiste, ho rimosso l'immagine dal div mettendo solo un background facendo quindi la prova direttamente sul div... per quanto riguarda la distorsione so che può succedere ma per ora è solo una prova per capire bene come funziona, una volta capito lo inserirò poi nel sito vero e proprio

[cavicchiandrea]

prova cosi

<script>
$(document).ready(function() {
$("#clickme").live({
click: function() {
  $("#animate1").animate({height: "50px", width: "50px"}, 1000);
}
});
});
</script>

[wakeinvisible]

Nada non funge

[cavicchiandrea]

Metti il link alla pagina online (tuosito.xxxx/paginademoresize.html)

[wakeinvisible]

Il codice è stand alone, non l'ho ancora inserito da nessuna parte appunto perchè vorrei prima capire e analizzare bene dove sbaglio per migliorarmi e poi lo inserisco nella pagina di mio interesse ma nulla non vuole proprio andare...

[cavicchiandrea]

Se rimpicciolisci l'immagine togli px vedi esempio http://webprogetti.it/formreset.asp.
Standalone non è un progetto web? Non sono sicuro che jquery funzioni potrebbe volere un protocollo/supporto server web (tipo http:// e non file://) prima di proseguire documentati bene se il progetto non sarà per il web rischi di lavorare per nulla