Ergebnis 1 bis 4 von 4
  1. #1
    Avatar von mikdoe
    mikdoe ist offline Administrator
    registriert
    01-05-2010
    Beiträge
    7.755

    Talking Resizeable Textarea

    Hi!
    Wie macht man unter eine Textarea eine solche feine Linie, die ich mit gedrückter Maustaste hoch und runter ziehen kann, um die Große zu ändern?
    resize_textarea.jpg

    Würde das gern kombiniert einsetzen mit diesem jQuery Autosize

  2. #2
    Avatar von kkapsner
    kkapsner ist offline Super Moderator
    registriert
    28-03-2008
    Beiträge
    17.732

    AW: Resizeable Textarea

    Wo hast du denn das Bild her?
    Es könnte das sein: https://developer.mozilla.org/en-US/docs/Web/CSS/resize - schaut in jedem Browser hald anders aus... und der IE unterstützt's nicht.

    Ansonsten würde ich sowas mit JS machen.

  3. #3
    Avatar von mikdoe
    mikdoe ist offline Administrator
    registriert
    01-05-2010
    Beiträge
    7.755

    AW: Resizeable Textarea

    Zitat Zitat von kkapsner Beitrag anzeigen
    Wo hast du denn das Bild her?
    Aus einem Forum. Das funktioniert übrigens auch im IE und sieht dort exakt genau so aus wie im Fx.

    Zitat Zitat von kkapsner Beitrag anzeigen
    Es könnte das sein: https://developer.mozilla.org/en-US/docs/Web/CSS/resize - schaut in jedem Browser hald anders aus... und der IE unterstützt's nicht.
    Daher kann es das nicht sein. Denn was ich gefunden habe klappt auch im IE.

    Zitat Zitat von kkapsner Beitrag anzeigen
    Ansonsten würde ich sowas mit JS machen.
    OK, und wie macht man das?
    Ich war nicht sicher, ob das CSS oder JS ist. Ich finde im Quelltext der Seite nicht die richtigen Stellen, das ist ein Moloch.

  4. #4
    Avatar von kkapsner
    kkapsner ist offline Super Moderator
    registriert
    28-03-2008
    Beiträge
    17.732

    AW: Resizeable Textarea

    In etwa so:
    Code:
    <!DOCTYPE html>
    
    <html>
    <head>
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
    <title>Fenstertitel</title>
    <script type="text/javascript" src="//kkjs.kkapsner.de/modules/kkjs.load.js"></script>
    <script type="text/javascript">
    kkjs.event.onWindowLoad(function(){
    	var t = kkjs.$("<textarea>")[0];
    	var line = kkjs.node.create({
    		tag: "div",
    		className: "line",
    		style: {
    			width: t.offsetWidth + "px"
    		}
    	});
    	t.parentNode.insertBefore(line, t.nextSibling);
    	var oldPos = null;
    	kkjs.event.add(line, "mousedown", function(ev){
    		oldPos = {
    			mousePosition: kkjs.event.getMousePosition(ev),
    			height: t.clientHeight
    		};
    	});
    	kkjs.event.add(document, "mousemove", function(ev){
    		if (oldPos){
    			var diff = kkjs.event.getMousePosition(ev).sub(oldPos.mousePosition);
    			t.style.height = diff.top + oldPos.height + "px";
    		}
    	});
    	kkjs.event.add(document, "mouseup", function(){
    		oldPos = null;
    	});
    });
    </script>
    <style type="text/css">
    .line {
    	height: 5px;
    	background-color: lightgray;
    }
    </style>
    </head>
    <body>
    <textarea></textarea>
    </body>
    </html>

Ähnliche Themen

  1. Antworten: 2
    Letzter Beitrag: 26-11-2009, 14:00
  2. Inhalt vom textarea in neues Fenster mit textarea
    Von waldwuffel im Forum JavaScript
    Antworten: 3
    Letzter Beitrag: 31-03-2008, 21:54
  3. Antworten: 3
    Letzter Beitrag: 24-11-2006, 17:34
  4. Antworten: 9
    Letzter Beitrag: 12-09-2003, 12:35
  5. netscape und resizeable
    Von Claas im Forum JavaScript
    Antworten: 0
    Letzter Beitrag: 04-11-2000, 18:57

Lesezeichen

Berechtigungen

  • Neue Themen erstellen: Nein
  • Themen beantworten: Nein
  • Anhänge hochladen: Nein
  • Beiträge bearbeiten: Nein
  •