Hallo!
Gibt es eigentlich eine einfache Lösung Dialogboxen in FHEMWEB in Firefox/IE zu verschieben (bspw. Tastenkombination) ?
Bisher behelfe ich mir mit einer Kombination aus Vergrößern und Verkleinern mit der Maus, weil ich keine direkte Tastenkombination bzw. direkte Möglichkeit mit der Maus kenne.
Beispielsweise würde ich im anhängenden Screeshot gerne die Box so verschieben, dass ich auch die Events sehe.
Irgendwie finde ich die vermutlich simple Lösung nicht.. >:(
Gruß, Christian
Habe gerade den FF auf dem MAC gestartet .... geht aber auch mit dem Safari, vermutlich auch dann im IE
Verschieben dirket kann ich auch nicht ABER die Größe ändern und dadurch indirekt verschieben
Oder das entsprechende Stylesheet anpassen, damit es auch al verschiebbar angezeigt wird - ich habe davon aber gegen Null Ahnung :-)
fhemweb.js verwendet die JQuery-UI Dialoge (https://api.jqueryui.com/dialog/). Da sie ohne Titelleiste gebaut werden, kann man sie nicht einfach mit der Maus verschieben, und von keyboard Shortcuts habe ich nicht gehoert. Bin aber fuer "sinnvolle" Aenderungen zu haben.
Zitat von: rudolfkoenig am 08 Mai 2017, 20:41:25
fhemweb.js verwendet die JQuery-UI Dialoge (https://api.jqueryui.com/dialog/). Da sie ohne Titelleiste gebaut werden, kann man sie nicht einfach mit der Maus verschieben, und von keyboard Shortcuts habe ich nicht gehoert. Bin aber fuer "sinnvolle" Aenderungen zu haben.
hier ist ein beispiel von einem Drag Window https://jqueryui.com/draggable/
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>jQuery UI Draggable - Default functionality</title>
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<link rel="stylesheet" href="/resources/demos/style.css">
<style>
#draggable { width: 150px; height: 150px; padding: 0.5em; }
</style>
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<script>
$( function() {
$( "#draggable" ).draggable();
} );
</script>
</head>
<body>
<div id="draggable" class="ui-widget-content">
<p>Drag me around</p>
</div>
</body>
</html>
Zitat$( "#draggable" ).draggable();
Dass es prinzipiell irgendwie geht, habe ich nie bezweifelt, ich brauche aber konkrete(!) Vorschlaege, wie ich es loesen soll. Eine einfache Variante waere im Dialog die Titelzeile anzuzeigen (in defaultCommon.css die Zeile mit titlebar loeschen), schaut aber mAn albern aus, da ich nicht weiss, was ich reinschreiben soll, und verschwendet Platz.
Vielleicht so:
/* jQuery-UI mods */
div.ui-dialog { border:3px solid #278727; padding: 0 0 0 0; }
div.ui-dialog-buttonpane{padding:0 0 0 0!important;}
div.ui-dialog-titlebar {padding:0 0 0 0!important;margin:0 0 0 0!important;border:none;background:#F0F0D8;font-size:80%;}
...
dann rücken die Buttons etwas zusammen und die Titelzeile wird schmaler.
würde es nicht reichen diesen einen dialog fest so weit nach links zu schieben das die events zu sehen sind?
Ich habe den Vorschlag von Ellert leicht modifziert uebernommen, damit kann man per Drag&Drop in der Titelleiste das Dialog verschieben, siehe Anhang. Verschieben per Keyboard geht nicht, dazu waere zusaetzlicher Code notwendig.
Pardon, die Störung.
Wie erzeuge ich eine Dialogbox?
Danke, erwe
Z.Bsp. in der FHEMWEB DetailAnsicht unten "Delete this device". Oder mit einem get Befehl.
klappt hervorragend
Danke Rudi