多行文本：在調整大小

我有我的網頁上一個文本應用樣式，與resize:both;多行文本：在調整大小

我希望能夠只有當用戶調整它的樣式應用到textarea的。最好我希望能夠用CSS做到這一點，但我不認爲有一個僞選擇器或方法，只能用純CSS工作。我錯了嗎？

失敗了，是否有我可以在jQuery中使用的事件？

將textarea重置爲其原始大小的最佳方式是什麼？這將再次與jQuery？

非常感謝。

來源

2014-02-11 Jimmery

對不起，我讀過它快。刪除我的評論。 – GuyT

http://stackoverflow.com/questions/5570390/resize-event-for-textarea –

所有的答案都出錯了，她只想在調整大小事件時應用樣式 –

不使用任何其他庫，用於創建文本區域自行調整大小事件可以做這樣的：

DEMO jsFiddle

$('textarea').on({ 
    mousedown: function(){ 
     $(this).data('size', $(this).width + '*' + $(this).height()); 
    }, 
    mouseup: function(){ 
     if($(this).data('size') != $(this).width + '*' + $(this).height()) 
      $(this).triggerHandler('resize'); 
    }, 
    resize: function(){ 
     console.log('textarea resized!'); 
    } 
});

來源

2014-02-11 11:45:31

雖然jQueryUI可調整大小的方法是解決此問題的絕佳解決方案，但我最終使用了此代碼的改編，因此我將標記爲正確。 – Jimmery

@Jimmery我接受它。這是一個很好的解決方案。除非你已經使用JqueryUI，否則我希望爲一個單一的功能加載整個庫是一件痛苦的事情。無論如何，如果你使用它，我的回答可能對你有所幫助。 –

你可以試試這個..

$("#mytextarea").resizable({ 
    resize: function() { 
     $(this).css("resize","both"); 
    } 
});

http://jsfiddle.net/gR9UV/

來源

2014-02-11 11:39:55

你忘了說你需要jQuery UI才能使它工作。 – TheYaXxE

您需要先製作tex在發佈resize事件之前，tarea可調整大小。您可以通過使用jQuery UI resizable()來完成此操作，並且您可以在其中調用resize事件。

CSS

.resizing { 
    background: #f2f2f2; 
    border: 1px solid #4cf; 
}

$("textarea").resizable({ // Making it resizables triggers resize associated events 
    resize: function() { 
     $(this).addClass('resizing'); // Add style while resizing 
    }, 
    stop: function() { 
     $(this).removeClass('resizing'); // Remove style after resize finishes 
    } 
});

這裏是一個DEMO

來源

2014-02-11 12:00:25

多行文本：在調整大小

回答

相關問題