sub7even
Mitglied
Hallo,
ich habe jetzt schon ein wenig herum probiert und gegoogled,
aber immernur gefunden wie man ein einzelnes Div Dragbar machen kann.
Ich möchte aber ein Fenster wie bei z.B. Windows erstellen,
welches nur über den Titel Dragbar ist.
Ich habe mir schon überlegt,
dass man es ja so lösen könnte
das mann den Titel Dragbar macht
und dan einfach die Coordinaten an das Div (fenster inhalt) übergibt.
Jedoch bekomme ich das nicht hin :/
Hoffe mir kann jemand helfen...
Hier mein aktueller Source:
EDIT: Hat sich erledigt, habe nun doch eine lösung gefunden!
Statt:
Einfach:
benutzen...
ich habe jetzt schon ein wenig herum probiert und gegoogled,
aber immernur gefunden wie man ein einzelnes Div Dragbar machen kann.
Ich möchte aber ein Fenster wie bei z.B. Windows erstellen,
welches nur über den Titel Dragbar ist.
Ich habe mir schon überlegt,
dass man es ja so lösen könnte
das mann den Titel Dragbar macht
und dan einfach die Coordinaten an das Div (fenster inhalt) übergibt.
Jedoch bekomme ich das nicht hin :/
Hoffe mir kann jemand helfen...
Hier mein aktueller Source:
Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css" rel="stylesheet" type="text/css"/>
<script src="http://code.jquery.com/jquery-latest.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>
<title>.:: Drag - Fenster::.</title>
<script>
$(document).ready(function(){
$( "#windrag" ).draggable();
});
</script>
<style>
html, body { width: 100%; height: 100%; }
</style>
</head>
<body>
<div id="window" style="height: 120px; width:300px; background-color:#CCC;">
<a id="windrag" style="width:300px; height:20px; display:block; background-color:#09F;">Fenster Titel</a>
<p>Das ist ein Text,<br/>
der in diesem Fenster steht...</p>
</div>
</body>
</html>
EDIT: Hat sich erledigt, habe nun doch eine lösung gefunden!
Statt:
Code:
$( "#window" ).draggable();
Code:
$( "#window" ).draggable({ handle: '#windrag' });
Zuletzt bearbeitet: