Sto cercando di utilizzare il jQuery ridimensionabile per ridimensionare il mio div, ho funzionato abbastanza bene tranne che dopo l'evento stop
, l'interfaccia utente di jQuery ripristinerebbe il valoreal valore pixel
.Come forzare jQuery ridimensionabile per utilizzare la percentuale?
Sono un violino a lavorare qui: http://jsfiddle.net/totszwai/j60h38fy/5/
Quando si trascina il contenitore current
per la prima volta, sarebbe calcola tutto il valore in modo corretto, ma dopo l'evento stop
, jQuery UI sarebbe aggiornare il% e il cambiamento torna al pixel ... quindi la prossima volta che lo trascini di nuovo, la% viene persa.
Come si forza jQuery a impostare il valore della larghezza su%? Potrei usare tecnicamente qualcosa come setTimeout, ma sarebbe troppo brutto.
E non voglio una soluzione per manipolare i div in pixel, perché potrei tecnicamente aggiungere n-div nella mia configurazione e quel codice con% dovrebbe funzionare con n-divs.
Se si dà un'occhiata ai miei neighbor
div, la% è tenuto lì, solo il current
preso sovrascritti. Ho anche provato a giocare con ui.element
direttamente così come impostare il ui.size.width
sul mio%, ma nessuno di quello funziona neanche.
Aggiornamento: Una soluzione è quella di memorizzare i dati ogni volta all'evento stop
e mai verificare di nuovo al start
, tuttavia, questo ancora non risolve il problema in cui stop
restituisce valore di pixel errato. Vedi jsFiddle aggiornato: http://jsfiddle.net/totszwai/j60h38fy/6/
Se solo jQuery ridimensionabile prende il mio valore%, tutto avrebbe funzionato come previsto.
Risolto: Beh, ho accettato la risposta di apaul34208
, poiché ho chiesto come utilizzare%. Tuttavia, per risolvere effettivamente ciò che originariamente volevo risolvere, alla fine uso pixel. Vedere la risposta che ho postato below, se quella risposta ti ha aiutato, per favore invitalo invece.
questo è migliore di quello di apaul ma, non dovresti usare
Il contenitore non deve essere una tabella, quindi questo funzionerà con le div. Se si utilizza
Grazie, buona soluzione! Fallisce il test di resistenza allo spostamento (per il ridimensionamento del rapporto di aspetto), ma anche tutte le altre risposte che usano '.resizable()' (perché l'altezza cambia durante il ridimensionamento mentre si tiene il turno) Tuttavia, questo è facile da risolvere facendo questo negli eventi 'resizable' e' stop': '$ (this) .css ('height', '')'. Ho biforcato il tuo violino e ho aggiunto diverse correzioni e miglioramenti qui: http: // jsfiddle.net/8auwgazu/ – nothingisnecessary
ho dovuto togliere fantasma e animare e tweak il vostro css un po ',
display: flex;
sembrava essere la causa risultati imprevisti, ma penso che forse ho inciampato su una soluzione semplice:Working Example
fonte
2014-12-02 01:55:10 apaul
Dopo martellare per un altro giorno, finalmente ho la soluzione perfetta. In realtà era molto più semplice di quanto pensassi, è solo che ho finito per complicare le cose.
Stavo cercando di ottenere le sue dimensioni dinamiche del
ui.helper
e ho provato a manipolare l'elemento neighbor allostop
. Ma quello che mi interessa davvero è la larghezzathis
dell'elemento e la larghezza del suo elemento immediato vicino ... così ho finisce per fare il seguente:Questa soluzione funziona per n + 1 DIV seduti fianco a fianco. Se si capovolge la larghezza con l'altezza, funzionerà anche con DIV impilati verticalmente.:)
Cheers!
Working jsFiddle
Nota: Il fantasma e animare opzione dal jQuery UI è ancora dando problema strano come prima. Si tratta di jQuery 2.0.2 e jQuery-UI 1.10.3, si spera che vengano presto riparati.
fonte
2014-12-02 15:53:47 codenamezero
Pensavo che stessi cercando di ottenere gli elementi che lavorano con ridimensionabili%, ho capito male la domanda? La tua risposta sembra restituire larghezze in px sia in Firefox che in Chrome. – apaul
Hum ... sì, hai ragione. Originariamente volevo farlo funzionare con% poiché non riuscivo a trovare un modo per regolare correttamente i DIV. Immagino che potrei semplicemente accettare la tua risposta, se potessi modificarla per lavorare con i DIV n + 1? – codenamezero
Farò un altro crack in seguito oggi – apaul
So che la mia risposta non è una "buona pratica" perché richiede di personalizzare una libreria frequentemente aggiornata, ma ha risolto il mio problema: Modificare la funzione "ridimensiona" all'interno del jquery-ui file .js per manipolare la larghezza come desideri. Nel mio caso ho bisogno il ridimensionamento di ignorare completamente larghezza in modo ho commentato il cambiamento "larghezza":
fonte
2016-08-08 22:06:25 gus
Sì, funzionerebbe, ma ti dirò dalla mia esperienza che l'hacking di librerie di terze parti è un rompicapo da mantenere e aggiornare per il futuro. Si possono anche introdurre bug oscuri che influiscono su altri codici vagamente correlati, rendendolo un incubo da tracciare e applicare patch/fix/hack. – codenamezero
Problemi correlati