NetObjects Fusion Updates

Fragen zu NetObjects Fusion aller Versionen
Benutzeravatar
Tommy Herrmann
Site Admin
Site Admin
Beiträge: 9589
Registriert: So 6. Dez 2020, 07:37
Wohnort: Berlin
Kontaktdaten:

Re: NetObjects Fusion Updates

Ungelesener Beitrag von Tommy Herrmann »

Hans,

das geht nicht. Man muss ganz von vorn beginnen – das haben wir aber fast alle getan. In den meisten Fällen hier wurde die Software Mobirise genutzt, die NOF in gewisser Weise ähnelt, aber deutlich moderner und wesentlich einfacher zu bedienen ist.

Bilder lassen sich herunterladen und in die neue Software importieren, und Texte können ebenfalls leicht kopiert werden. Insgesamt werden die meisten Seiten dadurch etwas schlanker, was der Internetpräsenz oft zugutekommt.
Benutzeravatar
Rancher
Moderator
Moderator
Beiträge: 606
Registriert: Di 8. Dez 2020, 18:37
Wohnort: Elsass

Re: NetObjects Fusion Updates

Ungelesener Beitrag von Rancher »

HansD hat geschrieben: Di 18. Aug 2026, 15:56 Wenn ich wüsste, wie ich die bestehenden Seiten einfach in ein anderes Tool überführen könnte würde ich das machen. Aber leider kenne ich aktuell noch kein Tool, welches ich dafür verwenden kann und, welches dann auch einfach zu bedienen ist. Vielleicht hast du ja einen Tipp.
Wie Du vielleicht bemerkt hast, bist Du hier im Mobirise-Forum. Tommy hatte seinerzeit, als klar wurde, dass NOF nicht mehr weiter entwickelt wird, Mobirise entdeckt, es getestet, und als würdigen Nachfolger von NOF empfohlen. So sind einige alte NOFler auf Mobirise umgestiegen.
Du kannst Dir Mobirise erst einmal als kostenlose Version anschauen und ausprobieren. Es ist wirklich einfach zu handhaben und intuitiv zu bedienen. Für eine moderne Website taugt NOF schon lange nicht mehr, NOF 10 schon gar nicht.
Stöbere doch einmal ein bisschen hier im Forum, da werden schon viele Fragen beantwortet und weitere kannst Du gerne stellen.
Wenn Dein Pferd tot ist, steig ab.
Benutzeravatar
struggle
Mitglied (Level 10)
Mitglied (Level 10)
Beiträge: 556
Registriert: So 4. Dez 2022, 11:55
Wohnort: Brandenburg

Re: NetObjects Fusion Updates

Ungelesener Beitrag von struggle »

Hallo Hans,

zeig ins doch einfach mal deine Webseite, die du mit NOF erstellt hast. Die wird ja online sein. Ich denke, dann können wir uns ein Bild davon machen, was zu unternehmen wäre.
Gruss
Reinhard
HansD
Mitglied (Level 1)
Mitglied (Level 1)
Beiträge: 4
Registriert: Mo 17. Aug 2026, 14:37

Re: NetObjects Fusion Updates

Ungelesener Beitrag von HansD »

Hallo Struggle,

es geht um die Homepage des GroMusle Heimatmuseums. www.gromusle.de.

Hans
Benutzeravatar
Tommy Herrmann
Site Admin
Site Admin
Beiträge: 9589
Registriert: So 6. Dez 2020, 07:37
Wohnort: Berlin
Kontaktdaten:

Re: NetObjects Fusion Updates

Ungelesener Beitrag von Tommy Herrmann »

Hans,

diese Webseite ist ja nun extrem einfach gehalten und sollte in wenigen Stunden in Mobirise neu erstellt sein. Dann kann man sie aber auch richtig am Handy betrachten, denn Mobirise erstellt automatisch angepasste Seiten.

Ich würde Dir raten die Software mal herunter zu laden und zu testen. Fange einfach mal an und erstelle die erste Seite, dann merkst Du es ja. Dann siehst Du auch gleich was die kostenlose Version zu bieten hat. Mit der Lizenz erhält man dann Zugriff auf Tausende von Vorlagen und vielen Werkzeugen, wie dem ganz wichtigen "Code Editor".

Downloadseite der Software (kostenlos und restlos unverbindlich):

https://history.mobirisesite.com/

Dir muss klar sein, dass Mobirise für eine Lizenz jährlich ca. 100,00 Euro kostet.

Ohne Lizenz hast Du nur die einfachsten Mittel und einen kleinen Link zur Software als "Branding" (Werbung) unten rechts auf jeder Seite.
Benutzeravatar
struggle
Mitglied (Level 10)
Mitglied (Level 10)
Beiträge: 556
Registriert: So 4. Dez 2022, 11:55
Wohnort: Brandenburg

Re: NetObjects Fusion Updates

Ungelesener Beitrag von struggle »

Hallo Hans,
da gebe ich Tommy recht, die Webseite ist extrem einfach gehalten. Ich bin sogar der Meinung, daß diese Webseite komplett mit der kostenlosen Version erstellt werden kann. Ein Branding scheint dich ja nicht zu stören, auf der jetzigen Webseite gibt es ja auch den Hinweis, daß sie mit Netobjects erstellt wurde.
Und möchtest du etwas besonderes, dann gibt es tolle Erweiterungen von Volker.
Vielleicht ist der Code-Editor gar nicht notwendig.
Also hau rein :D
Gruss
Reinhard
Volker
Moderator
Moderator
Beiträge: 3569
Registriert: Sa 12. Dez 2020, 22:35

Re: NetObjects Fusion Updates

Ungelesener Beitrag von Volker »

Zufälliger Weise arbeite ich gerade an einem PHP Script, das in der Lage sein wird alte HTML Seiten, also auch die mit NOF erstellt wurden, in Mobirise einzulesen, bzw. die Ihnhalte in die Neuzeit zu überführen.

Wer also möchte, kann mir mal gerne alte NOF Seiten zugänglich machen. Ich brauche "Futter" für mein Script :D
Ich denke das wird alte NOF User freuen wenn sie Ihre alte Seite in einem neuen Mobirise Kleidchen sehen :D
Volker
Moderator
Moderator
Beiträge: 3569
Registriert: Sa 12. Dez 2020, 22:35

Re: NetObjects Fusion Updates

Ungelesener Beitrag von Volker »

Code: Alles auswählen

{
  "settings": {
    "name": "Site 2026-04-13 22:41",
    "currentPage": "index.html",
    "theme": {
      "name": "startm5",
      "title": "StartM5",
      "titlePreset": "StartM5",
      "styling": {
        "primaryColor": "#9fe870",
        "secondaryColor": "#ffd7ef",
        "successColor": "#3a341c",
        "infoColor": "#320707",
        "warningColor": "#a0e2e1",
        "dangerColor": "#ffea64",
        "mainFont": "Inter Tight",
        "display1Font": "Inter Tight",
        "display1Size": 5,
        "display2Font": "Inter Tight",
        "display2Size": 4,
        "display5Font": "Inter Tight",
        "display5Size": 2,
        "display7Font": "Inter Tight",
        "display7Size": 1.4,
        "display4Font": "Inter Tight",
        "display4Size": 1.4,
        "isRoundedImages": true,
        "isRoundedButtons": true,
        "isLargeButtons": true,
        "isGhostButtonBorder": true,
        "underlinedLinks": false,
        "isAnimatedOnScroll": false,
        "isScrollToTopButton": false
      },
      "additionalSetColors": []
    },
    "path": "@PROJECT_PATH@",
    "versionFirst": "6.1.16",
    "siteFonts": [
      {
        "css": "'Inter Tight', sans-serif",
        "name": "Inter Tight",
        "url": "https://fonts.googleapis.com/css?family=Inter+Tight:100,200,300,400,500,600,700,800,900,100i,200i,300i,400i,500i,600i,700i,800i,900i"
      }
    ],
    "uniqCompNum": 24,
    "versionPublish": "6.1.12",
    "imageResize": true,
    "publishType": "local",
    "publishPath": "@PROJECT_PATH@",
    "screenshot": "screenshot.png"
  },
  "pages": {
    "index.html": {
      "settings": {
        "main": true,
        "title": "Home",
        "meta_descr": "",
        "header_custom": "",
        "footer_custom": "",
        "html_before": ""
      },
      "components": [
        {
          "alias": false,
          "_styles": {
            "padding-top": "~\"@{paddingTop}rem\"",
            "padding-bottom": "~\"@{paddingBottom}rem\"",
            "position": "relative",
            "background-position": "center center",
            "background-size": "cover",
            ".slider-container": {
              "overflow": "hidden",
              "width": "100%",
              "position": "relative",
              "cursor": "grab",
              "user-select": "none"
            },
            ".slider-track": {
              "display": "flex !important",
              "flex-wrap": "nowrap",
              "width": "max-content",
              "will-change": "transform"
            },
            ".item": {
              "width": "~\"@{cardWidth}px\" !important",
              "margin-right": "~\"@{spacing}px\"",
              "flex-shrink": "0"
            },
            ".item-wrapper": {
              "background-color": "@cardBg",
              "border-radius": "~\"@{borderRadius}px\"",
              "overflow": "hidden",
              "height": "100%",
              "display": "flex",
              "flex-direction": "column",
              "box-shadow": "0 10px 30px rgba(0, 0, 0, 0.05)",
              "transition": "transform 0.3s ease"
            },
            ".item-img img": {
              "width": "100%",
              "height": "~\"@{imageHeight}px\"",
              "object-fit": "cover",
              "filter": "brightness(0.45) saturate(0.7)",
              "transition": "filter 0.45s ease, transform 0.45s ease",
              "transform": "scale(1.03)"
            },
            ".item-wrapper:hover": {
              "transform": "translateY(-5px)"
            },
            ".item-wrapper:hover .item-img img": {
              "filter": "brightness(0.85) saturate(1)",
              "transform": "scale(1)"
            },
            ".item-content": {
              "padding": "25px",
              "display": "flex",
              "flex-direction": "column",
              "flex-grow": "1"
            },
            ".mbr-section-btn": {
              "margin-top": "auto !important"
            },
            ".mbr-is-editor .slider-track": {
              "transform": "none !important",
              "flex-wrap": "wrap !important",
              "width": "100% !important"
            },
            ".mbr-is-editor .item": {
              "margin-bottom": "30px"
            },
            ".item-title": {
              "color": "#bbb",
              "transition": "color 0.35s ease"
            },
            ".item-wrapper:hover .item-title": {
              "color": "#fff"
            },
            "H6": {
              "color": "#ffd7ef"
            }
          },
          "_name": "gallery03",
          "_sourceTheme": "startm5",
          "_customHTML": "<section data-bs-version=\"5.1\" class=\"gallery3 slider-section\" group=\"Gallery\" mbr-class=\"{'mbr-parallax-background': bg.parallax}\" mbr-style=\"{'background-color': bg.type === 'color' ? bg.value : 'transparent', 'background-image': bg.type === 'image' ? 'url(' + bg.value + ')' : 'none'}\">\n\n    <mbr-parameters>\n        <header>Hintergrund &amp; Overlay</header>\n        <fieldset type=\"background\" parallax=\"\" name=\"bg\" required=\"\">\n            <input type=\"image\" title=\"Hintergrundbild\" value=\"../_images/background1.jpg\">\n            <input type=\"color\" title=\"Hintergrundfarbe\" value=\"#232323\" selected=\"\">\n        </fieldset>\n        <input type=\"checkbox\" title=\"Overlay anzeigen\" name=\"overlay\" condition=\"bg.type !== 'color'\">\n        <input type=\"color\" title=\"Overlay Farbe\" name=\"overlayColor\" value=\"#000000\" condition=\"overlay &amp;&amp; bg.type == 'image'\">\n        <input type=\"range\" title=\"Overlay Deckkraft\" name=\"overlayOpacity\" min=\"0\" max=\"1\" step=\"0.1\" value=\"0.3\" condition=\"overlay &amp;&amp; bg.type == 'image'\">\n\n        <header>Slider-Layout</header>\n        <input type=\"checkbox\" title=\"Full Width\" name=\"fullWidth\" checked=\"\">\n        <input type=\"range\" title=\"Card-Breite (px)\" name=\"cardWidth\" min=\"150\" max=\"600\" step=\"10\" value=\"300\">\n        <input type=\"range\" title=\"Bild-Höhe (px)\" name=\"imageHeight\" min=\"100\" max=\"600\" step=\"10\" value=\"210\">\n        <input type=\"range\" title=\"Abstand\" name=\"spacing\" min=\"0\" max=\"100\" step=\"5\" value=\"20\">\n        \n        <header>Card Design</header>\n        <input type=\"color\" title=\"Card Hintergrund\" name=\"cardBg\" value=\"#393193\">\n        <input type=\"range\" title=\"Eckenrundung\" name=\"borderRadius\" min=\"0\" max=\"50\" step=\"1\" value=\"15\">\n        \n        <header>Effekte</header>\n        <input type=\"range\" title=\"Bild Helligkeit\" name=\"imgBright\" min=\"0.1\" max=\"1\" step=\"0.1\" value=\"0.7\">\n\n        <header>Abstände Block</header>\n        <input type=\"range\" inline=\"\" title=\"Oben\" name=\"paddingTop\" min=\"0\" max=\"10\" step=\"1\" value=\"4\">\n        <input type=\"range\" inline=\"\" title=\"Unten\" name=\"paddingBottom\" min=\"0\" max=\"10\" step=\"1\" value=\"4\">\n\n        <header>Inhalte</header>\n        <input type=\"checkbox\" name=\"showCardTitle\" title=\"Titel zeigen\" checked=\"\">\n        <input type=\"checkbox\" name=\"showCardSubtitle\" title=\"Untertitel zeigen\" checked=\"\">\n        <input type=\"checkbox\" name=\"showButtons\" title=\"Button zeigen\" checked=\"\">\n    </mbr-parameters>\n\n    <div class=\"mbr-overlay\" mbr-if=\"overlay &amp;&amp; bg.type !== 'color'\" mbr-style=\"{'background-color': overlayColor, 'opacity': overlayOpacity}\">\n    </div>\n    \n    <div mbr-class=\"{'container': !fullWidth, 'container-fluid': fullWidth}\" style=\"position: relative; z-index: 2;\">\n        <div class=\"slider-container\">\n            <div class=\"slider-track\" mbr-list=\"\">\n                <div class=\"item features-image active\" item=\"\">\n                    <div class=\"item-wrapper\">\n                        <div class=\"item-img\">\n                            <img src=\"@PROJECT_PATH@/assets/images/mbr-1-600x399.jpg\" alt=\"Slider Bild\" title=\"\" mbr-img=\"\">\n                        </div>\n                        <div class=\"item-content\">\n                            <h5 class=\"item-title mbr-fonts-style mt-3\" mbr-theme-style=\"display-7\" mbr-if=\"showCardTitle\" mbr-text=\"\">\n                                <b>Neues Projekt</b>\n                            </h5>\n                            <h6 class=\"item-subtitle mbr-fonts-style\" mbr-theme-style=\"display-4\" mbr-if=\"showCardSubtitle\" mbr-text=\"\">\n                                Beschreibungstext.\n                            </h6>\n                            <div class=\"mbr-section-btn mt-3\" mbr-if=\"showButtons\" mbr-buttons=\"\" mbr-list-grow=\"0\">\n                                <a class=\"btn btn-primary\" href=\"#\" mbr-theme-style=\"display-4\">Mehr</a>\n                            </div>\n                        </div>\n                    </div>\n                </div><div class=\"item features-image\" item=\"\">\n                    <div class=\"item-wrapper\">\n                        <div class=\"item-img\">\n                            <img src=\"@PROJECT_PATH@/assets/images/mbr-1920x1148.jpg\" alt=\"Slider Bild\" title=\"\" mbr-img=\"\" data-slide-to=\"1\" data-bs-slide-to=\"2\">\n                        </div>\n                        <div class=\"item-content\">\n                            <h5 class=\"item-title mbr-fonts-style mt-3\" mbr-theme-style=\"display-7\" mbr-if=\"showCardTitle\" mbr-text=\"\">\n                                <b>Neues Projekt</b>\n                            </h5>\n                            <h6 class=\"item-subtitle mbr-fonts-style\" mbr-theme-style=\"display-4\" mbr-if=\"showCardSubtitle\" mbr-text=\"\">\n                                Beschreibungstext.\n                            </h6>\n                            <div class=\"mbr-section-btn mt-3\" mbr-if=\"showButtons\" mbr-buttons=\"\" mbr-list-grow=\"0\">\n                                <a class=\"btn btn-primary\" href=\"#\" mbr-theme-style=\"display-4\">Mehr</a>\n                            </div>\n                        </div>\n                    </div>\n                </div><div class=\"item features-image\" item=\"\">\n                    <div class=\"item-wrapper\">\n                        <div class=\"item-img\">\n                            <img src=\"@PROJECT_PATH@/assets/images/mbr-10-1920x1280.jpg\" alt=\"Slider Bild\" title=\"\" mbr-img=\"\" data-slide-to=\"2\" data-bs-slide-to=\"2\">\n                        </div>\n                        <div class=\"item-content\">\n                            <h5 class=\"item-title mbr-fonts-style mt-3\" mbr-theme-style=\"display-7\" mbr-if=\"showCardTitle\" mbr-text=\"\">\n                                <b>Neues Projekt</b>\n                            </h5>\n                            <h6 class=\"item-subtitle mbr-fonts-style\" mbr-theme-style=\"display-4\" mbr-if=\"showCardSubtitle\" mbr-text=\"\">\n                                Beschreibungstext.\n                            </h6>\n                            <div class=\"mbr-section-btn mt-3\" mbr-if=\"showButtons\" mbr-buttons=\"\" mbr-list-grow=\"0\"><a class=\"btn btn-primary\" href=\"#\" data-app-placeholder=\"Type Text\">Mehr</a></div>\n                        </div>\n                    </div>\n                </div><div class=\"item features-image\" item=\"\">\n                    <div class=\"item-wrapper\">\n                        <div class=\"item-img\">\n                            <img src=\"@PROJECT_PATH@/assets/images/mbr-1920x1080.jpg\" alt=\"Slider Bild\" title=\"\" mbr-img=\"\" data-slide-to=\"3\" data-bs-slide-to=\"3\">\n                        </div>\n                        <div class=\"item-content\">\n                            <h5 class=\"item-title mbr-fonts-style mt-3\" mbr-theme-style=\"display-7\" mbr-if=\"showCardTitle\" mbr-text=\"\">\n                                <b>Neues Projekt</b>\n                            </h5>\n                            <h6 class=\"item-subtitle mbr-fonts-style\" mbr-theme-style=\"display-4\" mbr-if=\"showCardSubtitle\" mbr-text=\"\">\n                                Beschreibungstext.\n                            </h6>\n                            <div class=\"mbr-section-btn mt-3\" mbr-if=\"showButtons\" mbr-buttons=\"\" mbr-list-grow=\"0\">\n                                <a class=\"btn btn-primary\" href=\"#\" mbr-theme-style=\"display-4\">Mehr</a>\n                            </div>\n                        </div>\n                    </div>\n                </div><div class=\"item features-image\" item=\"\">\n                    <div class=\"item-wrapper\">\n                        <div class=\"item-img\">\n                            <img src=\"@PROJECT_PATH@/assets/images/mbr-4-1920x1280.jpg\" alt=\"Slider Bild\" title=\"\" mbr-img=\"\" data-slide-to=\"4\" data-bs-slide-to=\"5\">\n                        </div>\n                        <div class=\"item-content\">\n                            <h5 class=\"item-title mbr-fonts-style mt-3\" mbr-theme-style=\"display-7\" mbr-if=\"showCardTitle\" mbr-text=\"\">\n                                <b>Neues Projekt</b>\n                            </h5>\n                            <h6 class=\"item-subtitle mbr-fonts-style\" mbr-theme-style=\"display-4\" mbr-if=\"showCardSubtitle\" mbr-text=\"\">\n                                Beschreibungstext.\n                            </h6>\n                            <div class=\"mbr-section-btn mt-3\" mbr-if=\"showButtons\" mbr-buttons=\"\" mbr-list-grow=\"0\">\n                                <a class=\"btn btn-primary\" href=\"#\" mbr-theme-style=\"display-4\">Mehr</a>\n                            </div>\n                        </div>\n                    </div>\n                </div><div class=\"item features-image\" item=\"\">\n                    <div class=\"item-wrapper\">\n                        <div class=\"item-img\">\n                            <img src=\"@PROJECT_PATH@/assets/images/mbr-3-1920x1280.jpg\" alt=\"Slider Bild\" title=\"\" mbr-img=\"\" data-slide-to=\"5\" data-bs-slide-to=\"6\">\n                        </div>\n                        <div class=\"item-content\">\n                            <h5 class=\"item-title mbr-fonts-style mt-3\" mbr-theme-style=\"display-7\" mbr-if=\"showCardTitle\" mbr-text=\"\">\n                                <b>Neues Projekt</b>\n                            </h5>\n                            <h6 class=\"item-subtitle mbr-fonts-style\" mbr-theme-style=\"display-4\" mbr-if=\"showCardSubtitle\" mbr-text=\"\">\n                                Beschreibungstext.\n                            </h6>\n                            <div class=\"mbr-section-btn mt-3\" mbr-if=\"showButtons\" mbr-buttons=\"\" mbr-list-grow=\"0\">\n                                <a class=\"btn btn-primary\" href=\"#\" mbr-theme-style=\"display-4\">Mehr</a>\n                            </div>\n                        </div>\n                    </div>\n                </div>\n            </div>\n        </div>\n    </div>\n\n    [JS_CODE_0]\n</section>",
          "_cid": "vgKbYAsYlW",
          "_anchor": "gallery03-i",
          "_PHPplaceholders": [],
          "_JSplaceholders": [
            "<script>\n(function(){\n  var container, track;\n  var pos = 0, vel = 0;\n  var dragging = false;\n  var lastPointerX = 0, lastTime = 0;\n  var singleWidth = 0;\n\n  var FRICTION = 0.92;\n  var MIN_VEL = 0.2;\n\n  function init() {\n    if (document.querySelector('.mbr-is-editor')) return;\n    track = document.querySelector('.slider-track');\n    container = document.querySelector('.slider-container');\n    if (!track || track.dataset.looped === 'true') return;\n\n    var original = track.innerHTML;\n    track.innerHTML = original + original + original;\n    track.dataset.looped = 'true';\n    singleWidth = track.scrollWidth / 3;\n    pos = -singleWidth;\n    applyPos();\n\n    container.addEventListener('mousedown', onDown);\n    container.addEventListener('touchstart', onDown, {passive: false});\n    window.addEventListener('mousemove', onMove);\n    window.addEventListener('touchmove', onMove, {passive: false});\n    window.addEventListener('mouseup', onUp);\n    window.addEventListener('touchend', onUp);\n\n    requestAnimationFrame(tick);\n  }\n\n  function applyPos() {\n    while (pos > -singleWidth * 0.5) pos -= singleWidth;\n    while (pos < -singleWidth * 1.5) pos += singleWidth;\n    track.style.transform = 'translateX(' + pos + 'px)';\n  }\n\n  function tick() {\n    if (!dragging) {\n      vel *= FRICTION;\n      if (Math.abs(vel) > MIN_VEL) {\n        pos += vel;\n        applyPos();\n      }\n    }\n    requestAnimationFrame(tick);\n  }\n\n  function onDown(e) {\n    dragging = true;\n    lastPointerX = e.clientX !== undefined ? e.clientX : e.touches[0].clientX;\n    lastTime = performance.now();\n    vel = 0;\n    container.style.cursor = 'grabbing';\n    e.preventDefault();\n  }\n\n  function onMove(e) {\n    if (!dragging) return;\n    if (e.cancelable) e.preventDefault();\n    var x = e.clientX !== undefined ? e.clientX : e.touches[0].clientX;\n    var now = performance.now();\n    var dt = Math.max(now - lastTime, 1);\n    var dx = x - lastPointerX;\n    vel = dx / dt * 16;\n    pos += dx;\n    applyPos();\n    lastPointerX = x;\n    lastTime = now;\n  }\n\n  function onUp() {\n    dragging = false;\n    container.style.cursor = 'grab';\n  }\n\n  document.addEventListener('DOMContentLoaded', init);\n  if (typeof window.initOneAfterAnother !== 'undefined') init();\n})();\n</script>"
          ],
          "_protectedParams": [],
          "_global": false,
          "_once": false,
          "_params": {}
        },
        {
          "alias": false,
          "_styles": {
            "& when not (@fullScreen)": {
              "padding-top": "(@paddingTop * 1rem)",
              "padding-bottom": "(@paddingBottom * 1rem)"
            },
            "& when (@bg-type = \"color\")": {
              "background-color": "@bg-value"
            },
            "& when (@bg-type = \"image\")": {
              "background-image": "url(@bg-value)"
            },
            ".mbr-fallback-image.disabled": {
              "display": "none"
            },
            ".mbr-fallback-image": {
              "display": "block",
              "background-size": "cover",
              "background-position": "center center",
              "width": "100%",
              "height": "100%",
              "position": "absolute",
              "top": "0",
              "& when (@bg-type = 'video')": {
                "background-image": "url(@fallBackImage)"
              }
            },
            ".card-wrapper": {
              "background": "@wrapBgColor",
              "@media (max-width: 767px)": {
                "padding": "1.5rem"
              },
              "@media (min-width: 768px) and (max-width: 991px)": {
                "padding": "2.25rem"
              },
              "@media (min-width: 992px)": {
                "padding": "9rem 4rem"
              }
            },
            ".mbr-text, .mbr-section-btn": {
              "color": "#000000",
              "text-align": "center"
            },
            ".card-title, .card-box": {
              "text-align": "center",
              "color": "#2e481a"
            }
          },
          "_name": "article06",
          "_sourceTheme": "startm5",
          "_customHTML": "<section data-bs-version=\"5.1\" class=\"start article6\" group=\"Article\" data-bg-video=\"{{bg.type == 'video' && bg.value.url}}\" mbr-class=\"{\n    'mbr-fullscreen': fullScreen,\n    'mbr-parallax-background': bg.parallax}\">\n\t<mbr-parameters>\n\t\t<header>Size</header>\n\t\t<input type=\"checkbox\" title=\"Full Screen\" name=\"fullScreen\">\n\t\t<input type=\"checkbox\" title=\"Full Width\" name=\"fullWidth\">\n\t\t<input type=\"range\" inline title=\"Top\" name=\"paddingTop\" min=\"0\" max=\"10\" step=\"1\" value=\"0\">\n\t\t<input type=\"range\" inline title=\"Bottom\" name=\"paddingBottom\" min=\"0\" max=\"10\" step=\"1\" value=\"0\">\n\t\t<input type=\"range\" inline title=\"Content Width\" name=\"contentWidth\" min=\"4\" max=\"12\" step=\"1\" value=\"12\">\n\t\t<header>Show/Hide</header>\n\t\t<input type=\"checkbox\" title=\"Title\" name=\"showTitle\" checked>\n\t\t<input type=\"checkbox\" title=\"Text\" name=\"showText\">\n\t\t<input type=\"checkbox\" title=\"Buttons\" name=\"showButtons\">\n\t\t<input type=\"color\" title=\"Wrap Bg\" name=\"wrapBgColor\" value=\"#ffffff\">\n\t\t<header>Background</header>\n\t\t<fieldset type=\"background\" name=\"bg\" parallax>\n\t\t\t<input type=\"image\" title=\"Image\" value=\"../_images/background1.jpg\" parallax>\n\t\t\t<input type=\"color\" title=\"Color\" value=\"#ffffff\" selected>\n\t\t\t<input type=\"video\" title=\"Video\" value=\"https://vimeo.com/428046504\">\n\t\t</fieldset>\n\t\t<header condition=\"bg.type === 'video'\">Fallback Image</header>\n\t\t<input type=\"image\" title=\"Fallback Image\" value=\"../_images/background1.jpg\" name=\"fallBackImage\" condition=\"bg.type === 'video'\">\n\t\t<input type=\"checkbox\" title=\"Overlay\" name=\"overlay\" condition=\"bg.type !== 'color'\" checked>\n\t\t<input type=\"color\" title=\"Overlay Color\" name=\"overlayColor\" value=\"#ffffff\" condition=\"overlay && bg.type !== 'color'\">\n\t\t<input type=\"range\" inline title=\"Opacity\" name=\"overlayOpacity\" min=\"0\" max=\"1\" step=\"0.1\" value=\"0.3\" condition=\"overlay && bg.type !== 'color'\">\n\t</mbr-parameters>\n\n\t<div class=\"mbr-fallback-image disabled\" mbr-if=\"bg.type == 'video'\"></div>\n\t<div class=\"mbr-overlay\" mbr-if=\"overlay && bg.type!== 'color'\" mbr-style=\"{'opacity': overlayOpacity, 'background-color': overlayColor}\"></div>\n\t<div mbr-class=\"{'container': !fullWidth, 'container-fluid': fullWidth}\">\n\t\t<div class=\"row justify-content-center\">\n\t\t\t<div class=\"card col-md-12 col-lg-{{contentWidth}}\">\n\t\t\t\t<div class=\"card-wrapper\">\n\t\t\t\t\t<div class=\"card-box align-left\">\n\t\t\t\t\t\t<h4 class=\"card-title mbr-fonts-style\" mbr-theme-style=\"display-2\" mbr-if=\"showTitle\" data-app-selector=\".card-title, .card-box\">\n\t\t\t\t\t\t\t<b>Hier mit Lightbox<br>noch in Test Stadion</b></h4>\n\t\t\t\t\t\t<p class=\"mbr-text mbr-fonts-style mt-4\" mbr-theme-style=\"display-7\" mbr-if=\"showText\" data-app-selector=\".mbr-text, .mbr-section-btn\">\n\t\t\t\t\t\t\tClick any text to edit or style it. Select text to insert a link. Click blue \"Gear\" icon in\n\t\t\t\t\t\t\tthe top right corner to hide/show buttons, text, title and change the block background.\n\t\t\t\t\t\t\tClick red \"+\" in the bottom right corner to add a new block. Use the top left menu to create\n\t\t\t\t\t\t\tnew pages, sites and add themes.\n\t\t\t\t\t\t</p>\n\t\t\t\t\t\t<div mbr-buttons mbr-theme-style=\"display-7\" class=\"mbr-section-btn mt-4\" mbr-if=\"showButtons\" data-toolbar=\"-mbrBtnMove\">\n\t\t\t\t\t\t\t<a class=\"btn btn-white btn-lg\" href=\"https://mobiri.se\" data-app-placeholder=\"Type Text\">Start Now</a>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t</div>\n\t</div>\n</section>",
          "_cid": "vgKrsRgie6",
          "_anchor": "article06-l",
          "_protectedParams": [],
          "_global": false,
          "_once": false,
          "_params": {}
        },
        {
          "alias": false,
          "_styles": {
            "padding-top": "~\"@{paddingTop}rem\"",
            "padding-bottom": "~\"@{paddingBottom}rem\"",
            "position": "relative",
            "background-position": "center center",
            "background-size": "cover",
            ".native-slider-container": {
              "width": "100%",
              "overflow-x": "auto",
              "overflow-y": "hidden",
              "-webkit-overflow-scrolling": "touch",
              "cursor": "grab",
              "padding-bottom": "25px",
              "-ms-overflow-style": "none",
              "scrollbar-width": "none"
            },
            ".native-slider-container::-webkit-scrollbar": {
              "display": "none"
            },
            ".native-slider-track": {
              "display": "flex !important",
              "flex-wrap": "nowrap",
              "width": "max-content",
              "gap": "~\"@{spacing}px\"",
              "padding": "0 15px"
            },
            ".item": {
              "width": "~\"@{cardWidth}px\" !important",
              "flex-shrink": "0"
            },
            ".item-wrapper": {
              "background-color": "@cardBg",
              "border-radius": "~\"@{borderRadius}px\"",
              "overflow": "hidden",
              "height": "100%",
              "display": "flex",
              "flex-direction": "column",
              "position": "relative",
              "box-shadow": "0 10px 30px rgba(0, 0, 0, 0.2)"
            },
            ".item-img-wrap": {
              "position": "relative",
              "overflow": "hidden",
              "height": "~\"@{imageHeight}px\"",
              "cursor": "pointer"
            },
            ".item-img-wrap img": {
              "width": "100%",
              "height": "100%",
              "object-fit": "cover",
              "filter": "brightness(@imgBright) saturate(0.8)",
              "transition": "all 0.4s ease",
              "pointer-events": "none"
            },
            ".item-wrapper:hover .item-img-wrap img": {
              "filter": "brightness(1) saturate(1)",
              "transform": "scale(1.05)"
            },
            ".zoom-icon": {
              "position": "absolute",
              "top": "10px",
              "right": "10px",
              "background": "rgba(0, 0, 0, 0.5)",
              "border-radius": "50%",
              "width": "32px",
              "height": "32px",
              "display": "flex",
              "align-items": "center",
              "justify-content": "center",
              "opacity": "0",
              "transition": "0.3s",
              "pointer-events": "none"
            },
            ".item-wrapper:hover .zoom-icon": {
              "opacity": "1"
            },
            ".item-content": {
              "padding": "25px",
              "display": "flex",
              "flex-direction": "column",
              "align-items": "center",
              "text-align": "center",
              "flex-grow": "1"
            },
            ".item-title": {
              "color": "#bbbbbb !important",
              "transition": "0.3s"
            },
            ".item-wrapper:hover .item-title": {
              "color": "#ffffff !important"
            },
            ".mbr-section-btn": {
              "margin-top": "auto !important"
            },
            ".accent-line": {
              "position": "absolute",
              "bottom": "0",
              "left": "0",
              "right": "0",
              "height": "3px",
              "background-color": "@accentColor",
              "transform": "scaleX(0)",
              "transition": "0.4s ease"
            },
            ".item-wrapper:hover .accent-line": {
              "transform": "scaleX(1)"
            },
            ".simple-lb": {
              "display": "none",
              "position": "fixed",
              "inset": "0",
              "z-index": "100000",
              "background": "rgba(0, 0, 0, 0.95)",
              "align-items": "center",
              "justify-content": "center"
            },
            ".simple-lb img": {
              "max-width": "90vw",
              "max-height": "85vh",
              "border-radius": "5px",
              "border": "3px solid #fff",
              "width": "auto !important",
              "height": "auto !important",
              "object-fit": "contain"
            },
            ".simple-lb-close": {
              "position": "absolute",
              "top": "20px",
              "right": "30px",
              "color": "#fff",
              "font-size": "50px",
              "cursor": "pointer",
              "line-height": "1"
            },
            ".mbr-is-editor .native-slider-container": {
              "overflow-x": "visible !important"
            },
            ".mbr-is-editor .native-slider-track": {
              "flex-wrap": "wrap !important",
              "width": "100% !important"
            },
            ".mbr-is-editor .item": {
              "margin-bottom": "30px"
            },
            "H6": {
              "color": "#ffd7ef"
            }
          },
          "_name": "gallery03",
          "_sourceTheme": "startm5",
          "_customHTML": "<section data-bs-version=\"5.1\" class=\"gallery3 slider-section\" group=\"Gallery\" mbr-class=\"{'mbr-parallax-background': bg.parallax}\" mbr-style=\"{'background-color': bg.type === 'color' ? bg.value : 'transparent', 'background-image': bg.type === 'image' ? 'url(' + bg.value + ')' : 'none'}\">\n\n    <mbr-parameters>\n        <header>Hintergrund</header>\n        <fieldset type=\"background\" parallax name=\"bg\" required>\n            <input type=\"image\" title=\"Bild\" value=\"../_images/background1.jpg\">\n            <input type=\"color\" title=\"Farbe\" value=\"#111111\" selected>\n        </fieldset>\n        \n        <header>Slider Layout</header>\n        <input type=\"range\" title=\"Card-Breite\" name=\"cardWidth\" min=\"150\" max=\"600\" step=\"10\" value=\"300\">\n        <input type=\"range\" title=\"Bild-Hoehe\" name=\"imageHeight\" min=\"100\" max=\"600\" step=\"10\" value=\"210\">\n        <input type=\"range\" title=\"Abstand\" name=\"spacing\" min=\"0\" max=\"100\" step=\"5\" value=\"20\">\n        <input type=\"color\" title=\"Card-Farbe\" name=\"cardBg\" value=\"#1a1a1a\">\n        <input type=\"range\" title=\"Ecken\" name=\"borderRadius\" min=\"0\" max=\"50\" step=\"1\" value=\"4\">\n\n        <header>Effekte</header>\n        <input type=\"range\" title=\"Helligkeit\" name=\"imgBright\" min=\"0.1\" max=\"1\" step=\"0.05\" value=\"0.45\">\n        <input type=\"color\" title=\"Linien-Farbe\" name=\"accentColor\" value=\"#e0c070\">\n\n        <header>Abstaende</header>\n        <input type=\"range\" inline title=\"Oben\" name=\"paddingTop\" min=\"0\" max=\"10\" step=\"1\" value=\"4\">\n        <input type=\"range\" inline title=\"Unten\" name=\"paddingBottom\" min=\"0\" max=\"10\" step=\"1\" value=\"4\">\n\n        <header>Inhalt</header>\n        <input type=\"checkbox\" name=\"showCardTitle\" title=\"Titel\" checked>\n        <input type=\"checkbox\" name=\"showCardSubtitle\" title=\"Text\" checked>\n        <input type=\"checkbox\" name=\"showButtons\" title=\"Button\" checked>\n    </mbr-parameters>\n\n    <div class=\"mbr-overlay\" mbr-if=\"overlay && bg.type !== 'color'\" mbr-style=\"{'background-color': overlayColor, 'opacity': overlayOpacity}\"></div>\n\n    <div mbr-class=\"{'container': !fullWidth, 'container-fluid': true}\" style=\"position:relative;z-index:2;\">\n        <div class=\"native-slider-container\" id=\"native-slider\">\n            <div class=\"native-slider-track\" mbr-list>\n                \n                <div class=\"item features-image active\" item>\n                    <div class=\"item-wrapper\">\n                        <div class=\"item-img-wrap\">\n                            <img src=\"@PROJECT_PATH@/assets/images/mbr-1920x1285.jpg\" alt=\"Bild\" title mbr-img data-slide-to=\"1\" data-bs-slide-to=\"2\">\n                            <div class=\"zoom-icon\">\n                                <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"#fff\" stroke-width=\"2\" stroke-linecap=\"round\" width=\"16\" height=\"16\"><circle cx=\"11\" cy=\"11\" r=\"7\"></circle><line x1=\"16.5\" y1=\"16.5\" x2=\"22\" y2=\"22\"></line></svg>\n                            </div>\n                        </div>\n                        <div class=\"item-content\">\n                            <h5 class=\"item-title mbr-fonts-style mt-3\" mbr-theme-style=\"display-7\" mbr-if=\"showCardTitle\" mbr-text><b>Neues Projekt</b></h5>\n                            <h6 class=\"item-subtitle mbr-fonts-style\" mbr-theme-style=\"display-4\" mbr-if=\"showCardSubtitle\" mbr-text>Beschreibungstext hier.</h6>\n                            <div class=\"mbr-section-btn mt-3\" mbr-if=\"showButtons\" mbr-buttons mbr-list-grow=\"0\"><a class=\"btn btn-primary\" href=\"#\" mbr-theme-style=\"display-4\">Mehr</a></div>\n                        </div>\n                        <div class=\"accent-line\"></div>\n                    </div>\n                </div><div class=\"item features-image\" item>\n                    <div class=\"item-wrapper\">\n                        <div class=\"item-img-wrap\">\n                            <img src=\"@PROJECT_PATH@/assets/images/mbr-1470x1920.jpg\" alt=\"Bild\" title mbr-img data-slide-to=\"1\" data-bs-slide-to=\"2\">\n                            <div class=\"zoom-icon\">\n                                <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"#fff\" stroke-width=\"2\" stroke-linecap=\"round\" width=\"16\" height=\"16\"><circle cx=\"11\" cy=\"11\" r=\"7\"></circle><line x1=\"16.5\" y1=\"16.5\" x2=\"22\" y2=\"22\"></line></svg>\n                            </div>\n                        </div>\n                        <div class=\"item-content\">\n                            <h5 class=\"item-title mbr-fonts-style mt-3\" mbr-theme-style=\"display-7\" mbr-if=\"showCardTitle\" mbr-text><b>Neues Projekt</b></h5>\n                            <h6 class=\"item-subtitle mbr-fonts-style\" mbr-theme-style=\"display-4\" mbr-if=\"showCardSubtitle\" mbr-text>Beschreibungstext hier.</h6>\n                            <div class=\"mbr-section-btn mt-3\" mbr-if=\"showButtons\" mbr-buttons mbr-list-grow=\"0\"><a class=\"btn btn-primary\" href=\"#\" mbr-theme-style=\"display-4\">Mehr</a></div>\n                        </div>\n                        <div class=\"accent-line\"></div>\n                    </div>\n                </div><div class=\"item features-image\" item>\n                    <div class=\"item-wrapper\">\n                        <div class=\"item-img-wrap\">\n                            <img src=\"@PROJECT_PATH@/assets/images/mbr-1920x1148.jpg\" alt=\"Bild\" title mbr-img data-slide-to=\"2\" data-bs-slide-to=\"3\">\n                            <div class=\"zoom-icon\">\n                                <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"#fff\" stroke-width=\"2\" stroke-linecap=\"round\" width=\"16\" height=\"16\"><circle cx=\"11\" cy=\"11\" r=\"7\"></circle><line x1=\"16.5\" y1=\"16.5\" x2=\"22\" y2=\"22\"></line></svg>\n                            </div>\n                        </div>\n                        <div class=\"item-content\">\n                            <h5 class=\"item-title mbr-fonts-style mt-3\" mbr-theme-style=\"display-7\" mbr-if=\"showCardTitle\" mbr-text><b>Neues Projekt</b></h5>\n                            <h6 class=\"item-subtitle mbr-fonts-style\" mbr-theme-style=\"display-4\" mbr-if=\"showCardSubtitle\" mbr-text>Beschreibungstext hier.</h6>\n                            <div class=\"mbr-section-btn mt-3\" mbr-if=\"showButtons\" mbr-buttons mbr-list-grow=\"0\"><a class=\"btn btn-primary\" href=\"#\" mbr-theme-style=\"display-4\">Mehr</a></div>\n                        </div>\n                        <div class=\"accent-line\"></div>\n                    </div>\n                </div><div class=\"item features-image\" item>\n                    <div class=\"item-wrapper\">\n                        <div class=\"item-img-wrap\">\n                            <img src=\"@PROJECT_PATH@/assets/images/mbr-14-1920x1280.jpg\" alt=\"Bild\" title mbr-img data-slide-to=\"3\" data-bs-slide-to=\"4\">\n                            <div class=\"zoom-icon\">\n                                <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"#fff\" stroke-width=\"2\" stroke-linecap=\"round\" width=\"16\" height=\"16\"><circle cx=\"11\" cy=\"11\" r=\"7\"></circle><line x1=\"16.5\" y1=\"16.5\" x2=\"22\" y2=\"22\"></line></svg>\n                            </div>\n                        </div>\n                        <div class=\"item-content\">\n                            <h5 class=\"item-title mbr-fonts-style mt-3\" mbr-theme-style=\"display-7\" mbr-if=\"showCardTitle\" mbr-text><b>Neues Projekt</b></h5>\n                            <h6 class=\"item-subtitle mbr-fonts-style\" mbr-theme-style=\"display-4\" mbr-if=\"showCardSubtitle\" mbr-text>Beschreibungstext hier.</h6>\n                            <div class=\"mbr-section-btn mt-3\" mbr-if=\"showButtons\" mbr-buttons mbr-list-grow=\"0\"><a class=\"btn btn-primary\" href=\"#\" mbr-theme-style=\"display-4\">Mehr</a></div>\n                        </div>\n                        <div class=\"accent-line\"></div>\n                    </div>\n                </div><div class=\"item features-image\" item>\n                    <div class=\"item-wrapper\">\n                        <div class=\"item-img-wrap\">\n                            <img src=\"@PROJECT_PATH@/assets/images/mbr-1920x1276.jpg\" alt=\"Bild\" title mbr-img data-slide-to=\"4\" data-bs-slide-to=\"5\">\n                            <div class=\"zoom-icon\">\n                                <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"#fff\" stroke-width=\"2\" stroke-linecap=\"round\" width=\"16\" height=\"16\"><circle cx=\"11\" cy=\"11\" r=\"7\"></circle><line x1=\"16.5\" y1=\"16.5\" x2=\"22\" y2=\"22\"></line></svg>\n                            </div>\n                        </div>\n                        <div class=\"item-content\">\n                            <h5 class=\"item-title mbr-fonts-style mt-3\" mbr-theme-style=\"display-7\" mbr-if=\"showCardTitle\" mbr-text><b>Neues Projekt</b></h5>\n                            <h6 class=\"item-subtitle mbr-fonts-style\" mbr-theme-style=\"display-4\" mbr-if=\"showCardSubtitle\" mbr-text>Beschreibungstext hier.</h6>\n                            <div class=\"mbr-section-btn mt-3\" mbr-if=\"showButtons\" mbr-buttons mbr-list-grow=\"0\"><a class=\"btn btn-primary\" href=\"#\" mbr-theme-style=\"display-4\">Mehr</a></div>\n                        </div>\n                        <div class=\"accent-line\"></div>\n                    </div>\n                </div><div class=\"item features-image\" item>\n                    <div class=\"item-wrapper\">\n                        <div class=\"item-img-wrap\">\n                            <img src=\"@PROJECT_PATH@/assets/images/mbr-1920x1278.jpg\" alt=\"Bild\" title mbr-img data-slide-to=\"5\" data-bs-slide-to=\"5\">\n                            <div class=\"zoom-icon\">\n                                <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"#fff\" stroke-width=\"2\" stroke-linecap=\"round\" width=\"16\" height=\"16\"><circle cx=\"11\" cy=\"11\" r=\"7\"></circle><line x1=\"16.5\" y1=\"16.5\" x2=\"22\" y2=\"22\"></line></svg>\n                            </div>\n                        </div>\n                        <div class=\"item-content\">\n                            <h5 class=\"item-title mbr-fonts-style mt-3\" mbr-theme-style=\"display-7\" mbr-if=\"showCardTitle\" mbr-text><b>Neues Projekt</b></h5>\n                            <h6 class=\"item-subtitle mbr-fonts-style\" mbr-theme-style=\"display-4\" mbr-if=\"showCardSubtitle\" mbr-text>Beschreibungstext hier.</h6>\n                            <div class=\"mbr-section-btn mt-3\" mbr-if=\"showButtons\" mbr-buttons mbr-list-grow=\"0\"><a class=\"btn btn-primary\" href=\"#\" mbr-theme-style=\"display-4\">Mehr</a></div>\n                        </div>\n                        <div class=\"accent-line\"></div>\n                    </div>\n                </div>\n\n            </div>\n        </div>\n    </div>\n\n    <div id=\"simple-lb-wrap\" class=\"simple-lb\">\n        <span class=\"simple-lb-close\" onclick=\"document.getElementById('simple-lb-wrap').style.display='none'\">×</span>\n        <img id=\"simple-lb-img\" src>\n    </div>\n\n    [JS_CODE_0]\n</section>",
          "_PHPplaceholders": [],
          "_JSplaceholders": [
            "<script>\n    (function () {\n        if (document.querySelector('html').classList.contains('is-builder')) return;\n\n        const slider = document.getElementById('native-slider');\n        if (!slider) return;\n\n        let isDown = false;\n        let startX;\n        let scrollLeft;\n        let velX = 0;\n        let momentumID;\n        let isDragged = false;\n        let lastX;\n\n        // --- Desktop Schieben mit Wurf-Physik ---\n        slider.addEventListener('mousedown', (e) => {\n            isDown = true;\n            isDragged = false;\n            slider.style.cursor = 'grabbing';\n            cancelAnimationFrame(momentumID);\n            startX = e.pageX;\n            lastX = startX;\n            scrollLeft = slider.scrollLeft;\n            velX = 0;\n        });\n\n        slider.addEventListener('mouseleave', () => {\n            if (!isDown) return;\n            isDown = false;\n            slider.style.cursor = 'grab';\n            beginMomentum();\n        });\n\n        slider.addEventListener('mouseup', () => {\n            if (!isDown) return;\n            isDown = false;\n            slider.style.cursor = 'grab';\n            beginMomentum();\n        });\n\n        slider.addEventListener('mousemove', (e) => {\n            if (!isDown) return;\n            e.preventDefault();\n            const currentX = e.pageX;\n            const walk = (currentX - startX);\n            \n            // Ab 5px Bewegung gilt es als Drag (Lightbox Klick-Schutz)\n            if (Math.abs(walk) > 5) isDragged = true;\n\n            slider.scrollLeft = scrollLeft - walk;\n            \n            // Ermittelt die Geschwindigkeit (Wucht) für den Wurf\n            velX = -(currentX - lastX); \n            lastX = currentX;\n        });\n\n        // Die Physik-Formel für das sanfte Ausrollen\n        function beginMomentum() {\n            function loop() {\n                if (Math.abs(velX) > 0.5) {\n                    slider.scrollLeft += velX;\n                    velX *= 0.93; // Reibung - je näher an 1, desto länger rollt es\n                    momentumID = requestAnimationFrame(loop);\n                }\n            }\n            momentumID = requestAnimationFrame(loop);\n        }\n\n        // --- Lightbox Öffnung ---\n        slider.addEventListener('click', (e) => {\n            if (isDragged) return; // Wenn geschoben wurde, nicht öffnen!\n            \n            const imgWrap = e.target.closest('.item-img-wrap');\n            if (imgWrap) {\n                const img = imgWrap.querySelector('img');\n                if (img) {\n                    document.getElementById('simple-lb-img').src = img.src;\n                    document.getElementById('simple-lb-wrap').style.display = 'flex';\n                }\n            }\n        });\n    })();\n    </script>"
          ],
          "_anchor": "gallery03-k",
          "_cid": "vgKr45d0yE",
          "_protectedParams": [],
          "_global": false,
          "_once": false,
          "_params": {}
        },
        {
          "alias": false,
          "_styles": {
            "padding-top": "(@blockPadTop * 1rem)",
            "padding-bottom": "(@blockPadBot * 1rem)",
            "position": "relative",
            ".mobi-slider-window": {
              "width": "100%",
              "overflow-x": "auto",
              "overflow-y": "hidden",
              "-webkit-overflow-scrolling": "touch",
              "cursor": "grab",
              "padding-bottom": "25px",
              "scrollbar-width": "none",
              "-ms-overflow-style": "none"
            },
            ".mobi-slider-window::-webkit-scrollbar": {
              "display": "none"
            },
            ".mobi-slider-track": {
              "display": "flex !important",
              "flex-wrap": "nowrap",
              "width": "max-content",
              "gap": "(@blockGap * 1px)",
              "padding": "0 15px"
            },
            ".item": {
              "width": "(@blockWidth * 1px) !important",
              "flex-shrink": "0"
            },
           ...}
Das da oben ist eine gekürzte project.mobirise, in dieses "Kleidchen" packe ich dann einfach die HTML Seiten - dachte ich :D
Volker
Moderator
Moderator
Beiträge: 3569
Registriert: Sa 12. Dez 2020, 22:35

Re: NetObjects Fusion Updates

Ungelesener Beitrag von Volker »

Und nur zur Info :
Das wird ein Kommerzielles Script werden ...also nicht für Lau ;)
Das programmiere ich zu 80-90 % selber ohne KI - ist also echte Arbeit diesmal :D

Ich denke Tommy hat genug alte NOF Seiten die er mir mal zur Verfügung stellt ;)
Dann testen wir mal wie die nach meiner "PHP Kur" aussehen in Mobirise :D
Benutzeravatar
Tommy Herrmann
Site Admin
Site Admin
Beiträge: 9589
Registriert: So 6. Dez 2020, 07:37
Wohnort: Berlin
Kontaktdaten:

Re: NetObjects Fusion Updates

Ungelesener Beitrag von Tommy Herrmann »

Bin nur noch am Handy.

Ich stelle dir morgen früh ein ZIP Archiv mit 2 oder 3 kleinen NOF Projekten zusammen.

Dabei werde ich das Verzeichnis der lokalen Publizierung ebenso wie jenes mit der Projekt-Datei .nod zippen.

Ist sicherlich eine Herausforderung für Dich, die ich persönlich aber als ziemlich überflüssig betrachte.

Außerdem für wen willst Du das machen? NOF ist vor 10 Jahren liquidiert worden und fast jeder ist mittlerweile irgendwie umgestiegen.

Besser ist auf jeden Fall immer eine Neuerstellung, die dann auch automatisch moderne Elemente verwendet und einer veraltete Webseite neues Leben verleiht. Auch die alten Bilder sind von der Auflösung meist unbrauchbar für Mobirise.

Meiner Meinung ist das sicher nett gemeint aber am Thema vorbei.
Benutzeravatar
Rancher
Moderator
Moderator
Beiträge: 606
Registriert: Di 8. Dez 2020, 18:37
Wohnort: Elsass

Re: NetObjects Fusion Updates

Ungelesener Beitrag von Rancher »

HansD hat geschrieben: Fr 21. Aug 2026, 15:47 Hallo Struggle,

es geht um die Homepage des GroMusle Heimatmuseums. www.gromusle.de.

Hans
Ich bin auch der Meinung, dass man diese Seite relativ fix mit Mobirise neu machen könnte.
Wenn Euer Verein jedoch gar nichts investieren möchte, fände ich es auch keinen großen Schaden, die Homepage als NOF-Seite zu belassen. Es sind ja nur ein paar wenige Informationen und Bilder und wen das Ganze interessiert, der wird sich nicht zuerst am Design stören.

Irgendwie passt es ja, 50er Jahre und NOF-Style. :cool:
Wenn Dein Pferd tot ist, steig ab.
Volker
Moderator
Moderator
Beiträge: 3569
Registriert: Sa 12. Dez 2020, 22:35

Re: NetObjects Fusion Updates

Ungelesener Beitrag von Volker »

Naja Tommy,

es geht ja nicht nur um NOF Seiten. Es geht um alte HTML Seiten im allgemeinen, die mit verschiedenen Programmen erstellt wurden. Frontpage, Dreamveaver usw. Also Seiten die nicht mehr Zeitgemäß sind.

Mein Plan:

Ein standard Mobirise M5 Theme oben ein Menü, ein Header und ein HTML Block unten ein Footer.
Ich übernehme alle Inhalte einer HTML Seite und packe das da rein.

Ob das so klappt wie ich mir das vorstelle weiß ich auch noch nicht ;)
Volker
Moderator
Moderator
Beiträge: 3569
Registriert: Sa 12. Dez 2020, 22:35

Re: NetObjects Fusion Updates

Ungelesener Beitrag von Volker »

Tommy Herrmann hat geschrieben: Fr 21. Aug 2026, 19:23
Meiner Meinung ist das sicher nett gemeint aber am Thema vorbei.
Du hast Recht Tommy - für wen ?
Zahlen würde auch keiner was - also lassen wir es :D

Hab zwar schon einen kleinen Teilerfolg, aber es wäre echt harte Arbeit und würde noch Wochen dauern bis ich vorzeigbare Ergebnisse hätte. So eine Seite mit Mobirise direkt bauen - keine Stunde - fertig :D

Aber immerhin produziert mein PHP Script schon importierbare project.mobirise Dateien :D
Benutzeravatar
Tommy Herrmann
Site Admin
Site Admin
Beiträge: 9589
Registriert: So 6. Dez 2020, 07:37
Wohnort: Berlin
Kontaktdaten:

Re: NetObjects Fusion Updates

Ungelesener Beitrag von Tommy Herrmann »

Moin,

wie auch immer — ich habe es zu spät gelesen. Du hast eine PN mit drei NOF‑Projekten erhalten. Entpacke das ZIP‑Archiv; darin findest du die entsprechenden Ordner.

Öffne in jedem Ordner die Datei index.html.

Falls Du damit doch noch etwas machen möchtest und andere Projekte, z. B. in PHP, suchst, sag Bescheid. Ich habe weit mehr als 500 NOF‑Projekte.
HansD
Mitglied (Level 1)
Mitglied (Level 1)
Beiträge: 4
Registriert: Mo 17. Aug 2026, 14:37

Re: NetObjects Fusion Updates

Ungelesener Beitrag von HansD »

Tommy Herrmann hat geschrieben: Fr 21. Aug 2026, 15:55 Hans,

diese Webseite ist ja nun extrem einfach gehalten und sollte in wenigen Stunden in Mobirise neu erstellt sein. Dann kann man sie aber auch richtig am Handy betrachten, denn Mobirise erstellt automatisch angepasste Seiten.

Ich würde Dir raten die Software mal herunter zu laden und zu testen. Fange einfach mal an und erstelle die erste Seite, dann merkst Du es ja. Dann siehst Du auch gleich was die kostenlose Version zu bieten hat. Mit der Lizenz erhält man dann Zugriff auf Tausende von Vorlagen und vielen Werkzeugen, wie dem ganz wichtigen "Code Editor".

Downloadseite der Software (kostenlos und restlos unverbindlich):

https://history.mobirisesite.com/

Dir muss klar sein, dass Mobirise für eine Lizenz jährlich ca. 100,00 Euro kostet.

Ohne Lizenz hast Du nur die einfachsten Mittel und einen kleinen Link zur Software als "Branding" (Werbung) unten rechts auf jeder Seite.

Hallo zusammen,

danke für all eure Informationen. Werde mich bei Gelegenheit mal mit Mobirise beschäftigen.

Gruß
Hans
Antworten

Wer ist online?

Mitglieder in diesem Forum: Amazon [Bot] und 2 Gäste