dynamisch wechselnde position eigenschaft in css-datei nach d'n'd

Question

hoffe du kannst mir helfen, wieder :) ich möchte ein wenig webbasierte gui-designer zu bauen. Der Benutzer kann in den Editor-Modus wechseln und die Komponenten per Drag'n'Drop überall dort platzieren, wo er will. Wenn er/sie wieder in den Benutzermodus wechselt, möchte ich die Positionsdetails in der externen CSS-Datei via Javascript aktualisieren. Ich habe mir ein paar Beispiele angeschaut, die genau das tun, was ich will, aber ich kann mir nicht vorstellen, wie es funktioniert.

thnx im Voraus, dg

Answer 1

Um externe Stylesheets mit JS zu bearbeiten Sie benötigen, um die Methoden, die hier aufgeführt verwenden: http://www.quirksmode.org/dom/w3c_css.html (siehe Stylesheets Zugriff auf und Ändern von Style Sheets). Wie Sie aus den PPKs-Tabellen sehen können, gibt es einige signifikante CSS-Inkompatibilitäten - dies ist ein Randfall und ich weiß nicht, wie Sie diese generierte CSS-Datei speichern würden.

Ich würde Postings (möglicherweise mit Ajax) die Werte zurück zum Server, der die neue CSS-Datei generiert, die dann von der Benutzermodus-Seite aufgerufen wird.

Im Bearbeitungsmodus würde ich alle Stile inline (style = "...") haben und dann beim Übergeben der Seite die Stileigenschaften jedes Elements auflisten, um die Werte zu extrahieren und sie zum Erstellen einer POST-Anfrage zu verwenden. Erstellen Sie dann die neue Datei auf dem Server.

Answer 2

Sie jquery verwenden möchten ... es CSS verwendet Gruppen von Elementen auszuwählen, und ermöglicht es Ihnen, die CSS-Stil auf die Elemente zu manipulieren Sie

können sagen, Sie haben ein div-Element mit der Klasse awesomeDiv ausgewählt haben:

<div class="awesomeDiv">some content</div> 

können Sie diesen auswählen jquery mit der folgenden Zeile ein:

$(".awesomeDiv") 

und Sie können die CSS ändern wie folgt:

$(".awesomeDiv").css({'background-color': '#000000', 'width': '250px'});