Datenschutz Impressum

NOF-Schule | Forum

zur Schule NOF-NetObjects-Tutorials von Tommy Herrmann


Hotspots in Mobirise?
#1
In NOF war es kein Problem, aber wie macht man Hot-Spots in Mobi?

Frank
Webseite des Benutzers besuchen Alle Beiträge dieses Benutzers finden
Diese Nachricht in einer Antwort zitieren
#2
... da gibt es verschiedene Möglichkeiten (ich gucke mal morgen)

http://mattstow.com/experiment/responsiv...-maps.html
Webseite des Benutzers besuchen Alle Beiträge dieses Benutzers finden
Diese Nachricht in einer Antwort zitieren
#3
Hallo Frank,

damit habe ich mich vor einiger Zeit auch auseinandergesetzt. Wie du schreibst war das in NOF ja kein Problem. Hehe!

Für meine Seite mit Mobirise musste ich dann andere Wege finden. Wobei der Ansatz von Tommy richtig ist, mir aber nicht das gewünschte Ergebniss gebracht hatte.

Da ich mom. keine Möglichkeit sehe einen ganzen Block unter Mobirise zu exportieren im Anhang mal ein Word-Dokument, in dem du meinen Block selber aufziehen kannst. (Code, CSS etc ist enthalten).

Meine Hotspots (Klick auf die kleinen Bilder) die ich über ein Bild gelegt habe und die dann auch responsiv sind hier zum Testen: Hotspots Fewo

In dem Word-Dokument habe ich dir auch mal alle meine damals gesammelten Links zu dem Thema aufgeführt. Nimmt hier zuviel Platz.

Die notwendigen JS-Files etc. sind im zweiten gepackten File enthalten.

Ich hoffe das hilft weiter. Smiling

Lieben Gruß

Fewo


Angehängte Dateien
.docx   Responsive MapResizer mit HotSpots.docx (Größe: 16,39 KB / Downloads: 2)
.rar   imageMapResizer.rar (Größe: 3,75 KB / Downloads: 2)
Alle Beiträge dieses Benutzers finden
Diese Nachricht in einer Antwort zitieren
#4
Dank Euch, dann habe ich morgen was zu lesen.
Mein Shop-Projekt kommt nicht in die Pötte Undecided - da habe ich zeit
Webseite des Benutzers besuchen Alle Beiträge dieses Benutzers finden
Diese Nachricht in einer Antwort zitieren
#5
Moin,

eine Möglichkeit für das Setzen von Hot-spots in Mobirise ist auch für mich von (größerem) Interesse. Habe mir dazu gestern zunächst die Lösung von @Fewo angeschaut und dann seine Dateien geladen. Das erzielte Ergebnis von Fewo erscheint mir ausgesprochen gut, allerdings dürfte der Weg zum Ziel kein einfacher sein. Sei es drum, soweit bin ich noch nicht.

Aus meiner Sicht sollte aber auch Mobirise eine einfache(re) Lösung zum Setzen von Hotspots innerhalb der Software anbieten, auch wenn das für ein Block-System vielleicht nicht am Einfachsten zu Programmieren wäre. Ist den Experten hier im Forum bekannt, ob bzw. wieweit Mobirise daran arbeitet, oder ob MBR an solcher Verbesserung kein Interesse zeigt wird?

Ich vermute eine Anwenderzahl wäre größer, als es hier die Zahl der Beiträge wiederspiegelt - im englischsprachigen Bereich von Google ergibt die Suche nach "bootstrap hot-spots" bei mir 899.000 Ergebnisse.
Auch wenn nicht alle dortigen Ergebniss echte Relevanz dazu besitzen, sollte Mobirise mit der Thematik Hot-Spots nicht ins Hintertreffen geraten und 899.000 Suchergebnisse als Ansporn betrachten.

Mit Gruß und Hoffnung, dass das Thema wach gehalten bleibt...
Wolfgang
-----
Den Kopf hat man nicht nur für den Hut oder den Friseur
-----
500 C/M bis A77
Z270-A i5-7600K und SSD's, GTX1050Ti
Win 7 + 10, u.a. PS & LR
NOF post mortem:
Bootstrap vs openElement


Alle Beiträge dieses Benutzers finden
Diese Nachricht in einer Antwort zitieren
#6
... das ist bei responsiven Seiten (die Position eines absoluten Hotspots, wie früher bei NOF, verändert sich ja mit jeder Veränderung der Display-Größe) jetzt nicht so einfach und das kann Mobirise nicht mal eben so einbauen.

Dazu muss man schließlich die entsprechenden und ganz individuellen Koordinaten des Hotspots kennen und Mobirise kann diese ja schlecht wissen, denn die sind so individuell wie ein Pickel auf der Stirn :eek:

https://www.w3schools.com/tags/tag_map.asp
Webseite des Benutzers besuchen Alle Beiträge dieses Benutzers finden
Diese Nachricht in einer Antwort zitieren
#7
Moin Wolfgang

einige User aus diesem Forum, die intensiv mit Mobirise arbeiten,
haben schon mehrfach über den Support "Wünsche" geäußert.
Ich persönlich habe es ca. 10-12 mal versucht.
Eine Anwort habe ich nie erhalten, ich denke, den anderen Usern erging es ebenso.

Mir ist auch nicht bekannt, das irgendwelche, speziellen Wünsche umgesetzt wurden.
Stobi hat glaube ich, mehr fach die Bitte über einen Blog geäußert...
Ich brauchte für einer meinen Kunden auch einen Blog, habe diesen hier gekauft...

https://simplephpscripts.com/design-blog-php/

...und nicht auf Mobi gewartet.
Mit freundlichen Grüßen
Claus aus dem hohen Norden

(Berge sind ja ganz schön, nur platt müssen sie sein!)
Alle Beiträge dieses Benutzers finden
Diese Nachricht in einer Antwort zitieren
#8
... wie in Gottes Namen sollte Mobirise einen Hotspot mittels Generator-Software anbieten - das geht nicht. Da ist dann schon eigenes Fummeln angesagt (siehe meinen letzten Beitrag)
Webseite des Benutzers besuchen Alle Beiträge dieses Benutzers finden
Diese Nachricht in einer Antwort zitieren
#9
Nix fummeln !

https://www.image-map.net/
Webseite des Benutzers besuchen Alle Beiträge dieses Benutzers finden
Diese Nachricht in einer Antwort zitieren
#10
Moin,

und Dank an @stobi de und nochmal an @Fewo für die beiden alternativen Hot-spot-Lösungen.

Und @Tommy gebe ich ja darin recht, dass es für Mobirise nicht ganz einfach ist für Hot spots eine Lösung zu finden, ...zudem wäre es ja auch fatal, wenn Mobirise wüßte, wo auf meiner Stirn ein Pickel... Smiling

Wieder ernsthafter: ich stelle mir zur komplexen Hot-spot-Lösung inkompetenterweise vor, dass man in Relation zur Originalgröße des Bildes (100 %) bei horizontaler und vertikaler Anpassung für responsive Webseiten die urspünglichen Hot-spot-Koordinaten auch prozentual anpassen können müßte (statt Pixel-Definition). Es scheint ja bei den Lösungen, auf die Fewo und Stobi verwiesen haben, wohl zu funktionieren.

Die Variante vom Stobi https://www.image-map.net/ habe ich zwar nicht gleich ausprobiert, sie scheint mir aber einfach und flexibel im Link-Design (Rechteck, Kreis usw) und in der Link-Zieleingabe (mit Titel) zu sein. Wenn es denn auch nach Einbau ins Mobirise-Projekt funktionieren würde (responsiv), hope so.

Und noch etwas Respektvolles: Stobi muss viel gesucht haben, denn wo er fündig wurde (https://www.image-map.net/ ), gibt es im Text den Suchbegriff „Hot spot“ gar nicht!

Thxs & Gruß
Wolfgang
-----
Den Kopf hat man nicht nur für den Hut oder den Friseur
-----
500 C/M bis A77
Z270-A i5-7600K und SSD's, GTX1050Ti
Win 7 + 10, u.a. PS & LR
NOF post mortem:
Bootstrap vs openElement


Alle Beiträge dieses Benutzers finden
Diese Nachricht in einer Antwort zitieren
#11
"Wissen" heißt "Wissen wers weiß!"
Stand irgendwann im Mobi - Forum. Smiling
Webseite des Benutzers besuchen Alle Beiträge dieses Benutzers finden
Diese Nachricht in einer Antwort zitieren
#12
Frank,

so ein Programm ist natürlich toll, damit kann man die Koordinaten errechnen lassen. Nur nutzt das bei einer responsiven Seite eben nichts. Sobald sich die Bildgröße ändert, ändern sich auch die Koordinaten.

FEWO hat ja auch brutal geschummelt :D sobald sich das Display verkleinert verschwindet die Karte mit den Hotspots und wird durch kleine Piktogramme ersetzt, weil eben genau das so nicht geht. Mal abgesehen davon, dass FEWO diese Landkarte so schnell wie möglich von der Webseite nehmen sollte, das ist eine krasse Urheberrechts - Verletzung. Landkarten unterliegen einem strengen Copyright und dürfen nicht einfach verwendet werden.

Ich glaube man kann das mit komplizierten jQuery Skripten live errechnen lassen - ich habe das aber noch nicht probiert.

So einfach geht das jedenfalls nicht Sad

https://stackoverflow.com/questions/7844...-image-map



Beispiel:

http://mattstow.com/experiment/responsiv...-maps.html

Die Koordinaten sehen dann im Beispiel so aus und müssen zusätzlich mit JavaScript berechnet werden. Viel Erfolg beim Nachbauen :D

Code:
<map name="powerpuffgirls">
 <area shape="poly" coords="122,36,281,36,285,37,287,39,289,42,289,47,289,48,278,77,276,81,274,84,271,85,218,85,218,90,210,90,208,95,207,99,204,100,72,100,26,87,23,84,20,81,19,76,35,40,37,38,43,35,62,35,65,30,68,26,72,25,115,25,119,27,121,30,122,36,122,36" href="#ppg" title="The Powerpuff Girls" alt="The Powerpuff Girls" />
 <area shape="poly" coords="864,668,912,650,922,668,971,667,973,718,981,722,985,729,988,731,1010,731,1010,742,833,742,833,730,865,730,865,721,874,721,874,718,864,668,864,668" href="#cn" title="Cartoon Network" alt="Cartoon Network" />
 <area shape="poly" coords="1010,298,995,281,979,267,962,256,944,248,927,242,909,238,876,236,857,237,838,240,817,246,797,255,778,266,761,281,746,299,735,322,730,335,728,346,726,348,721,349,709,344,711,361,718,378,708,380,697,388,688,398,685,404,685,411,686,419,691,425,698,429,707,431,735,426,743,427,752,433,762,444,774,454,798,469,787,483,779,481,772,482,761,486,753,495,747,505,746,516,746,521,748,527,751,532,759,538,741,561,734,572,732,584,733,591,737,599,744,604,754,607,765,604,776,597,797,570,817,543,857,488,865,488,893,488,910,485,924,483,930,483,935,485,939,490,934,496,931,501,929,506,932,514,938,519,945,522,954,523,966,521,979,516,985,512,989,507,993,500,994,493,991,484,986,476,967,464,982,454,998,440,1013,425,1024,409,1024,329,1017,312,1010,298,1010,298" href="#buttercup" title="Buttercup" alt="Buttercup" />
 <area shape="poly" coords="571,101,563,83,562,66,549,80,541,96,537,112,536,128,537,141,531,141,508,141,508,141,511,133,517,126,533,114,500,111,476,111,452,114,438,118,424,124,410,131,400,140,392,152,390,167,391,174,394,183,400,191,409,198,391,215,379,234,371,252,368,271,367,277,368,298,371,316,381,338,396,358,414,375,399,378,387,385,379,393,377,405,378,412,382,418,388,424,395,429,411,434,425,435,431,446,439,456,459,474,480,488,502,500,514,507,523,515,528,523,530,534,529,541,526,547,515,562,532,556,548,547,562,536,574,523,583,508,590,490,594,470,596,448,596,430,591,410,587,398,599,390,613,382,628,371,643,356,657,337,666,313,669,299,670,284,669,276,668,264,670,263,697,263,704,261,711,257,716,251,719,243,718,236,715,231,706,221,694,215,683,213,677,213,670,215,664,220,656,232,645,215,652,206,657,199,660,191,662,181,660,169,655,158,648,150,638,142,617,130,596,120,582,112,571,101,571,101" href="#blossom" title="Blossom" alt="Blossom" />
 <area shape="poly" coords="254,286,232,271,207,260,179,254,150,252,119,254,103,257,88,263,71,270,61,275,58,274,57,273,45,269,36,268,17,271,7,276,1,283,0,283,0,285,0,290,0,352,2,354,1,355,1,390,3,401,5,410,9,420,22,441,39,460,58,476,47,480,38,487,32,494,30,504,33,515,41,524,53,531,69,534,77,533,85,530,90,525,93,518,91,512,88,508,85,505,85,502,86,499,89,497,97,496,120,500,138,503,154,503,167,503,185,531,215,576,235,609,241,617,248,622,255,626,265,628,273,626,280,621,285,614,287,605,283,592,276,580,261,558,269,553,273,547,276,541,277,536,274,524,267,513,257,504,250,501,244,501,240,502,237,503,225,488,242,478,259,468,276,451,282,447,292,446,318,450,327,448,334,445,339,439,341,431,337,419,329,409,318,401,307,398,301,398,301,393,301,391,303,391,321,393,336,391,352,387,370,380,387,370,373,368,364,364,358,360,353,354,350,347,347,330,345,313,343,302,340,293,336,286,331,280,318,272,305,267,293,266,282,267,272,270,262,276,254,286,254,286" href="#bubbles" title="Bubbles" alt="Bubbles" />
</map>
Webseite des Benutzers besuchen Alle Beiträge dieses Benutzers finden
Diese Nachricht in einer Antwort zitieren
#13
Da haben wir es mal wieder!
Ich sollte hier nicht irgendwas schreiben, was ich nicht vorher ausprobiert habe.

Nun habe ich es aber ausprobiert und muss sagen: es klappt nicht.

SORRY Sad

Müsste hier sein
https://www.afripix.de/laurels/

Die Köpfe der Massis - aber nix geht. Nichtmals ansatzweise
Webseite des Benutzers besuchen Alle Beiträge dieses Benutzers finden
Diese Nachricht in einer Antwort zitieren
#14
https://www.afripix.de/laurels/

Damit gemacht:
https://www.jqueryscript.net/other/jQuer...tspot.html

Klappt aber auch nicht 100%
Das Bild wird nicht proportional verkleinert
Webseite des Benutzers besuchen Alle Beiträge dieses Benutzers finden
Diese Nachricht in einer Antwort zitieren
#15
...dann sage ich auch: schade zu den erhofften, aber wohl wenig Erfolg versprechenden "Lösungen".
Und widme mein "hope so" an Mobirise für eine eventuelle Vielleicht-Irgendwann-Lösung.
Aber am Thema dran bleiben, das kann ja nicht schaden: die Hoffnung stirbt zuletzt.

Gruß
Wolfgang
-----
Den Kopf hat man nicht nur für den Hut oder den Friseur
-----
500 C/M bis A77
Z270-A i5-7600K und SSD's, GTX1050Ti
Win 7 + 10, u.a. PS & LR
NOF post mortem:
Bootstrap vs openElement


Alle Beiträge dieses Benutzers finden
Diese Nachricht in einer Antwort zitieren


Möglicherweise verwandte Themen…
Thema Verfasser Antworten Ansichten Letzter Beitrag
  Mobirise - Hoverfarbe WRH 21 230 14.09.2019, 09:15
Letzter Beitrag: WRH
  Mobirise-Navbar Bootsnipp bearbeiten Thomas Saake 2 60 12.09.2019, 11:35
Letzter Beitrag: Thomas Saake
  Mobirise- Seite darf nicht im Internet gefunden werden Thomas Saake 9 159 09.09.2019, 14:52
Letzter Beitrag: Thomas Saake
  Alte Mobirise Website verlinken blubbs84 1 50 08.09.2019, 11:58
Letzter Beitrag: Rancher
  Mobirise 4 Parallax: Bilder auf mobilen Geräten pixelig CeDe 6 85 07.09.2019, 18:37
Letzter Beitrag: stobi_de
  Lexikon - Script von Mobirise? Utz29 6 94 07.09.2019, 18:16
Letzter Beitrag: Utz29
  Mobirise-Hamburger zentriert unter Logo Thomas Saake 2 76 05.09.2019, 15:35
Letzter Beitrag: Thomas Saake
  Mobirise-Hamburger Menü zentrieren und Beschriften Thomas Saake 6 120 03.09.2019, 21:19
Letzter Beitrag: Thomas Saake
  Mobirise-Hamburger Menü Thomas Saake 2 92 02.09.2019, 10:10
Letzter Beitrag: Thomas Saake
  Mobirise-Toogle Formatierung 2 Thomas Saake 13 298 24.08.2019, 21:06
Letzter Beitrag: stobi_de



Benutzer, die gerade dieses Thema anschauen: 1 Gast/Gäste
nach oben An den Anfang der Seite scrollen
NetObjects Fusion Infos, Downloads und Updates Diese Website wird durch Bot-Trap vor Spam geschützt!