Mit html positionieren

  • Seite 2 von 3
27.07.2015 21:10
avatar  Schippo
#16 RE: Mit html positionieren
avatar
Mitglied

Hallo Olaf,

funktioniert leider noch nicht ganz. Die Kerze läßt sich zwar bewegen und mit auf eine andere Position nehmen, man kann sie aber nicht ablegen. Die gewählte Position wird nicht gehalten, sondern die Kerze springt wieder an den Ausgangspunkt zurück. Wo liegt der Fehler? Habe die alten Script- und CSS-Einträge gelöscht und das neue Script erst mal in den Quelltext der Seite gesetzt. Habe zum Ausprobieren eine Testseite nur mit der Kerze angelegt http://dogs24.xobor.de/page-645566-5.html

Habe schon im Computerforum nach Lösungen gefragt, aber dort ist man auch ziemlich ratlos. Konnte bisher nur in Erfahrung bringen, daß der Doctyp nicht geändert werden muß, da er aktuell ist und html5 entspricht. Das muß doch irgendwie gehen, Xobor hat das doch beim Verschieben der Boxen im Portal auch hinbekommen und das ist ja hier nicht so viel anders.

LG Schippo


 Antworten

 Beitrag melden
27.07.2015 21:26
avatar  Olaf
#17 RE: Mit html positionieren
Ol
Mitglied

Ich habe das Script jetzt mal im Beitrag getestet und es funktioniert dort tatsächlich nicht.
Warum weiß ich auch nicht.

Gruß
Olaf

__________________________

http://138600.homepagemodules.de/

 Antworten

 Beitrag melden
27.07.2015 21:34
avatar  Schippo
#18 RE: Mit html positionieren
avatar
Mitglied

Ich denke, es fehlt die Anweisung zum Positionieren bzw. Ablegen. Das kann keine so große Hürde mehr sein, denn immerhin läßt sich die Kerze ja schon mal bewegen. Also ein kleiner Schritt in die richtige Richtung.

Vielleicht weiß ja noch jemand unter den html-Experten Rat. Ich weiß bloß nicht, wo die alle stecken.

LG Schippo


 Antworten

 Beitrag melden
27.07.2015 21:36
avatar  Schippo
#19 RE: Mit html positionieren
avatar
Mitglied

noch eine Frage - funktioniert das Script denn bei Dir und nur bei mir nicht?


 Antworten

 Beitrag melden
27.07.2015 21:40
avatar  Olaf
#20 RE: Mit html positionieren
Ol
Mitglied

Das Script funktioniert schon,nur nicht in einen Beitrag.


Gruß
Olaf

__________________________

http://138600.homepagemodules.de/

 Antworten

 Beitrag melden
27.07.2015 21:52
avatar  Schippo
#21 RE: Mit html positionieren
avatar
Mitglied

Hallo Olaf,

muß ich nicht zuerst einmal das jQuery + jQuery UI einbinden oder ist das von Hause aus vorhanden? Und wenn ja, wie binde ich das denn ein?

Gruß aus dem Tal der Ahnungslosen


 Antworten

 Beitrag melden
27.07.2015 21:57
avatar  Olaf
#22 RE: Mit html positionieren
Ol
Mitglied

Die UI ist standartmäßig schon vorgeladen.

Gruß
Olaf

__________________________

http://138600.homepagemodules.de/

 Antworten

 Beitrag melden
28.07.2015 20:45 (zuletzt bearbeitet: 28.07.2015 21:08)
avatar  Schippo
#23 RE: Mit html positionieren
avatar
Mitglied

Hallo Olaf,

den Fehler konnte ich inzwischen finden und nun funktioniert es auch. Im Head-Bereich mußte der Code für die jQuery UI

1
 
1111<script src="http://code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
 


eingebunden und einige Korrekturen durchgeführt werden. Das Script sieht jetzt so aus:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
771
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
<script src="http://code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
<script>
(function() {
'use strict';
 
$(document).ready(function()
{
$("#verschieben").draggable({
cursor: "move",
opacity: 0.7,
scroll: false
});
});
 
})();
</script>
 




Allerdings ist noch nicht so ganz der Effekt erzielt, den ich erzielen wollte. Die Kerze läßt sich jetzt x-beliebig verschieben, aber auch aus der Seite, die ja gerahmt ist, heraus. Man kann ja die Seite wie eine Art Container sehen. Aber auch innerhalb der Seite gibt es ja die Besonderheit, daß der Platz für die Bildung der Lichterkette nicht so ganz unbegrenzt ist. Unterhalb der Lichterkette befindet sich eine Kommentarfunktion und diese sollte natürlich nicht von Kerzen überlagert werden. Außerdem kann man die Kerze jetzt zwar verschieben und x-beliebig an einem anderen Platz positionieren, aber das ist nicht das, was es werden sollte. Die 1. Kerze (Mutterobjekt) soll an ihrem Platz verbleiben. Der Besucher soll lediglich hiervon so viele Kopien ziehen können, wie er will und damit die Lichterkette bilden. Das Mutterobjekt soll immer an seinem Platz verbleiben. Jetzt wird das Mutterobjekt verschoben.

Hast Du hierfür eine Lösung oder vielleicht irgend ein anderer Experte? Sag schon jetzt danke für jede Hilfe.

Ich habe keine Ahnung, warum beim Einfügen des Codes immer wieder die Leerzeilen eingefügt werden, aber die mußt Du Dir wegdenken, auf meiner Seite sind die nicht vorhanden.

LG Schippo


 Antworten

 Beitrag melden
28.07.2015 21:57
avatar  Olaf
#24 RE: Mit html positionieren
Ol
Mitglied

Dein Vorhaben ist kompliziert und bedarf einer besonderen Logik.
Du musst genau wissen,was soll passieren,wenn die Kerze fest an einer Stelle bleiben soll.
Auch wie soll der Kommentar unter jeder Kerze stehen,wenn nachher viele Kerzen auf einer Seite verschoben worden sind.Es wird dann schnell alles unübersichtlicht.Es muss jede Position gespeichert werden.
Das wird glaube ich eine ganz schwere Aufgabe für Dich.
Du mußt Dich mit Draggable und seinen vielen Option vertraut machen.Sonst wird das nichts.
Wichtig ist auch,das sich die Kerzen nicht aus dem Fenster heraus verschieben lassen.
Dafür müsstest Du Dir die Option "containment: '#ID'," mal genau ansehen oder um eine Verschiebepositionen zu ermitteln,um sie abzuspeichern,mußt Du Dir die Funktion "stop: function( event, ui ) {}" genau ansehen.
Aber wie gesagt,Du musst Dich da hineinknien.
Ich werde mich aus diesen Project ausklinken,weil ich dafür zu wenig Zeit habe.

Gruß
Olaf

__________________________

http://138600.homepagemodules.de/

 Antworten

 Beitrag melden
28.07.2015 22:56
avatar  Schippo
#25 RE: Mit html positionieren
avatar
Mitglied

Hallo Olaf,

vielen Dank für Deine Mühe. Habe nicht gedacht, daß es derartig schwierig ist. Allerdings wurde eine Sache von Dir falsch verstanden - nicht unter jeder Kerze soll eine Kommentarfunktion hinzugefügt werden. Die Kerzen stehen ohne Kommentar völlig allein. Unterhalb der Lichterkette befindet sich bereits eine Kommentarfunktion für allgemeine Kommentare (facebook comments plugin). Das funktioniert bereits.

Ich beschäftige mich schon mit den Möglichkeiten von jQuery, aber für mich als Newbie ist es sehr schwer, da durchzublicken. War schon glücklich, daß mir mit html so vieles gelungen ist. Wenn alle Stricke reißen, dann muß ich halt Xobor beauftragen.

Nochmals danke.

LG Schippo


 Antworten

 Beitrag melden
28.07.2015 23:04
avatar  Schippo
#26 RE: Mit html positionieren
avatar
Mitglied

Sorry Frank,

habe Deinen Beitrag ganz überlesen. Das hast Du völlig richtig verstanden. Die Mutterkerze soll an ihrer festen Stelle der Seite verbleiben und nur Kopieen hiervon x-beliebig aneinandergefügt werden, also vervielfältigen.

Ich hätte nicht gedacht, daß das derartig schwierig ist. Sag Euch allen an dieser Stelle schon mal ganz herzlich danke für Eure Hilfe.

LG Schippo


 Antworten

 Beitrag melden
29.07.2015 20:04 (zuletzt bearbeitet: 29.07.2015 20:09)
avatar  Schippo
#27 RE: Mit html positionieren
avatar
Mitglied

Hallo @all,

mit meiner Lichterkette bin ich ein Stückchen weitergekommen. Die Kerzen lassen sich jetzt per Drag+Drop x-beliebig positionieren und die Mutterkerze bleibt auch an ihrem festen Platz stehen. So sieht das Script inzwischen aus:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
 
<script src="http://code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
<script>
(function() {
'use strict';

$(document).ready(function()
{
$("#verschieben").draggable({
helper: "clone",
cursor: "move",
opacity: 0.7,
scroll: false
});

$("#verschieben").bind('dragstop', function(event, ui) { $(this).after($(ui.helper).clone().draggable());});
});
})();
</script>
 

2 Probleme müssen noch gelöst werden, und zwar mit einem mouseout-Event den Bereich festlegen, damit die Kerzen nicht über die Seite hinaus bewegt werden können und auch innerhalb der Seite nur über einen bestimmten Bereich sich erstrecken. Hier müssen doch m.E. Variable eingebunden werden. Ich kann hierüber nichts im Internet finden. Kann mir jemand sagen, wie und mit welchen codes ich das einbinden muß?

2. Wenn ich die Seite verlasse, sind alle Formierungen wieder weg. Wie stoppt man das Ganze, um die Formierung auch nach Verlassen der Seite zu erhalten? Auch hierüber kann ich nicht finden, zumindest nicht in deutscher Sprache.

Hoffe sehr, daß mir jemand von Euch weiterhelfen kann.

LG Schippo


 Antworten

 Beitrag melden
29.07.2015 21:04
avatar  Olaf
#28 RE: Mit html positionieren
Ol
Mitglied

Scheinbar liest Du hier die Beiträge gar nicht...

Zitat von Olaf im Beitrag #24

Wichtig ist auch,das sich die Kerzen nicht aus dem Fenster heraus verschieben lassen.
Dafür müsstest Du Dir die Option "containment: '#ID'," mal genau ansehen


1
2
3
4
5
6
7
 
$("#verschieben").draggable({
helper: "clone",
cursor: "move",
opacity: 0.7,
scroll: false
containment: '.default-css',
});
 



Gruß
Olaf

__________________________

http://138600.homepagemodules.de/

 Antworten

 Beitrag melden
29.07.2015 21:29
avatar  Schippo
#29 RE: Mit html positionieren
avatar
Mitglied

Hallo Olaf,

dankeschön, ich lese schon alles, prasselt nur zu viel auf einmal auf mich herein. Alles nicht so leicht für einen Newbie.

Gruß Schippo


 Antworten

 Beitrag melden
30.07.2015 09:27
#30 RE: Mit html positionieren
avatar
Mitglied

Hi Schippo,
ich überfliege dieses Thema die ganze Zeit nur.
Ohne etwas selber nachzubauen und zu sehen,
fällt es mir schwer es komplett zu verstehen.
Darum frage ich lieber nochmal nach ;-)

Soll sich jeder an dieser Lichterkette beteiligen können?
Soll das Ergebnis dann wiederum für jeden sichtbar sein um sich daran wieder beteiligen zu können?
Mir fehlt nämlich die ganze Zeit über die Speicherung der Anzahl der Kerzen und deren Koordinaten hier im Thema.

Wenn jeder für sich selbst eine Kette bauen soll,
dann reicht eine Speicherung per localStorage oder Cookies.
Falls es aber eine "Gemeinschaftskette" sein soll,
dann müssen die Daten so gespeichert werden daß sie jeder wieder ausliest.
Das wären dann globale oder besser noch Datavariablen im PI-System.

Mehr kann ich zu diesem Thema auf leider nicht beitragen.

Gruß
Frank


Boardnr. 621181

www.aquariumzimmer.de
Boardnr. 572886
Business Template

 Antworten

 Beitrag melden
Bereits Mitglied?
Jetzt anmelden!
Mitglied werden?
Jetzt registrieren!