#1 Element auf jeder Seite immer am gleichen Ort von sgrafik 22.03.2018 20:31

avatar

Ich möchte gerne auf der Seite ein Element (Bildmarke mit evtl. einem Link) einsetzen, das auf allen Seiten immer am gleichen Ort erscheint (>unten links), ähnlich wie der Hilfe-Button bei Jimdo



Ich hoffe ihr versteht was ich meine - Kann mir da jemand helfen?
Vielen Dank
SG

#2 RE: Element auf jeder Seite immer am gleichen Ort von az_ 23.03.2018 12:24

avatar

...das ist relativ einfach: setze das Element in die Sidebar, dann erscheint es auf jeder Seite. Dann brauchst Du es nur noch zu positionieren. Dazu kannst Du den Container des Elementes mit position:absolut; oder fixed; aus der Sidebar befreien.

Noch eleganter ist es, wenn Du ihn mit jQuery verschiebst: Google mal nach ".appendTo"

LG, az

#3 RE: Element auf jeder Seite immer am gleichen Ort von sgrafik 24.03.2018 12:23

avatar

Vielen Dank! hat mir schon recht geholfen ...

Zitat
Noch eleganter ist es, wenn Du ihn mit jQuery verschiebst: Google mal nach ".appendTo"


soviel Wissen bringe ich leider nicht mit ... die Suche bringt mir viele Infos - aber verstehen tu ich nichts ...


Work in Progress
mit folgendem Versuchs-Code habe ich aber noch kleine Probleme - wie bringe ich die noch weg?

1
2
3
4
5
6
7
8
9
10
 
<iframe src="https://image.jimcdn.com/app/cms/image/transf/dimension=1000x10000:format=png/path/s901bbc630718c617/image/ieff9fa7c6bf1c8b6/version/1521889232/image.png" 
scrolling="no"
style="border: none;
overflow: none;
width: 33%;
position: fixed;
top: 40px;
left: 5px;
z-index: 9999;“>
</iframe>
 



- wieso erscheint mir eine Lupe und das Logo ist vergrösserbar? sollte nicht sein
- wieso überdeckt das Logo in der Mobilen Ansicht die Navigation, sodass diese nicht mehr anwählbar ist?

Vielen Dank!
LG
SG

#4 RE: Element auf jeder Seite immer am gleichen Ort von az_ 25.03.2018 19:11

avatar

...den iframe brauchst Du nicht.

- nimm ein Jimdo-Standardbildelement.
- dieses setzt Du als erstes Element in die Sidebar deiner Seite
- im Ansuchtsmodus klickst Du auf dieses Element mit der rechte Maustaste und wählst "Element untersuchen" (Chrome)
- jetzt holst Du Dir die ID des Elementes:



- die nimmst Du jetzt (statt "#123456789") mit einer Raute davor als ID-Bezeichner für das CSS und das JS-Skript.

Beispiel (s. https://designtest-tokyo.jimdo.com/) - hier habe ich ein "Bild mit Text"-Element benutzt:

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
 

<style type="text/css">
/*<![CDATA[*/

#cc-m-11853479657 {
position: absolute;
top: 150px;
z-index: 9999;
color: white !important;
text-align: center;
}

#cc-m-11853479657 img {
max-width: 150px;
-webkit-border-radius: 150px;
-moz-border-radius: 150px;
border-radius: 150px;
}

/*]]>*/
 
</style>
 
<script type="text/javascript">
//<![CDATA[

$('#cc-m-11853479657').appendTo('.jtpl-logo').addClass('pseudologo');

//]]>
 
</script>
 
 




Die Skripte kannst Du entweder als html-Widget hinter dem Element (...auch in der Sidebar) anordnen oder in den head-Bereich Deiner Webseite einsetzen.

Ggf. musst Du das CSS für mobile Ansichten noch anpassen. Google dafür nach "@media (max-width: 767px)"


LG, az


PS: Schrift-Logos sind nicht unbedingt empfehlenswert

Xobor Einfach ein eigenes Forum erstellen
Datenschutz