# Divs verschieben mit jQuery - Framesetnachahmung



## deluxeondecks (4. Januar 2011)

Hallo liebe jQuery-Fans 

gesundes neues Jahr wünsch ich euch erstmal.

Ich möchte mit zwei Divs die Funktionalitäten eines Framesets nachahmen. 
Um genau zu sein, das verschieben der "Fenstergrößen" - in dem Falle der Divs.

Hab das ganze auch schon umgesetzt mit jQuery soweit ich das konnte. Nun zu meinem Problem. Wenn man jetzt das linke Div (gelb) nach rechts verschiebt, wird das rechte Div (grün) zunächst nach unten verschoben, da der Platz nicht ausreicht. Das sieht etwas verzerrt aus und ist auch nicht sehr schön. Wenn man das rechte Div nach links verschiebt der gleiche Effekt. 

Kann mir jemand helfen, das die Divs feiner verschoben werden wie man das bei einem Frameset hat?

Hier mein Code:


```
<html>
<head>	
	<script type="text/javascript">
		
	$(document).ready(function(){
		var height;
		var width; 
		var windowWidth = $(window).width();
		var windowHeight = $(window).height();
		var folderWidth =  $('#folder').width();
		var folderContentWidth =  $('#folderContent').width();
				
		$(function() {
	        var resizeOpts = {
	          stop: reportNewSize  
	        };
	        function reportNewSize() {
	       		height = $(this).height();
				width =  $(this).width();

		        if (width  < folderWidth ) {
					var resize = folderWidth - width;
					var newFolderContentWidth = folderContentWidth + resize;
					$('#folderContent').width(newFolderContentWidth);
				} else if (width > folderWidth) {
	
					var resize = width - folderWidth;
					var newFolderContentWidth = folderContentWidth - resize;
					$('#folderContent').width(newFolderContentWidth);
				} 
    
	        }
	        $('#folder').resizable(resizeOpts);
	    });
	}); 
	</script>
</head>
<body>
	<div id="head"></div>
	<div id="folder"></div>
	<div id="folderContent"></div>
	<div id="contentDetails"></div>
</body>
</html>
```

Danke für eure Hilfe!


----------



## deluxeondecks (6. Januar 2011)

Hat denn keiner eine Ahnung? Es muss doch eine Lösung geben... glaub das es gar ni so schwer ist wie ich vermute...


----------



## CPoly (6. Januar 2011)

Gib einfach beiden Divs das gleiche Resize-Handle, dann sollte alles von alleine funktionieren und wird zu einem Einzeiler.
http://jqueryui.com/demos/resizable/#option-handles


----------



## deluxeondecks (10. Januar 2011)

funktioniert leider nicht wie gewollt


----------

