Dirk: oberen Teil eines Frameinhaltes verdecken

problematische Seite

In einem Frame habe ich einen Prestahop eingebunden. Die oberen Shopbedingten Laufbilder z.B. Excepateur würde ich dabei gerne verdecken, da sie nicht auf eine Elektroseite passen. Wenn ich die größe des Frames reduziere, wird nur unten etwas weggeschnitten. Habt Ihr eine Lösung?

  1. Hallo,

    der Link zu deiner Seite fehlt.

    In wie weit kannst du denn überhaupt in den HTML- / CSS-Quellcode eingreifen und wie gut kennst du dich damit aus?

    Grundsätzlich gibt es Möglichkeiten, aber ohne deine Seite zu kennen kann niemand beurteilen, ob das auch bei deiner Seite passt.

    Außerdem solltest du dir über die rechtlichen Voraussetzungen im Klaren sein. Du brauchst entweder die Erlaubnis die andere Seite einzubinden oder musst es so machen dass eindeutig erkennbar ist, dass es sich um eine Fremdseite handelt.

    Gruss

    MrMurphy

    1. Hallo

      der Link zu deiner Seite fehlt.

      Nö. Siehe Eröffnungsposting⇒Link namens „problematische Seite“ oberhalb des Textes.

      Tschö, Auge

      --
      Es schimmerte ein Licht am Ende des Tunnels und es stammte von einem Flammenwerfer.
      Terry Pratchett, „Gevatter Tod“
      1. Hallo,

        danke, das hatte ich übersehen.

        Gruss

        MrMurphy

        1. Hallo

          danke, das hatte ich übersehen.

          Kein Problem.

          Tschö, Auge

          --
          Es schimmerte ein Licht am Ende des Tunnels und es stammte von einem Flammenwerfer.
          Terry Pratchett, „Gevatter Tod“
    2. Hallo,

      du kannst auf die Frames ganz verzichten oder in das untere Frame die Lösung nach meinem Beispiel einbauen. Der Verzicht auf Frames ist eleganter. Du benötigst ein div und darin ein iFrame. In das iframe kommt dann die Verkaufsseite. Ein paar Erläuterungen habe ich direkt in die Beispielseite eingestellt:

      <!DOCTYPE html>
      <html lang="de">
      <head>
         <meta charset="utf-8">
         <title>iFrame 01</title>
         <meta name="description" content="HTML5, CSS3">
         <meta name="viewport" content="width=device-width, initial-scale=1.0">
         <!-- Um alte IE HTML5-tauglich zu machen -->
         <!--[if lt IE 9]>
            <script src="http://html5shiv-printshiv.googlecode.com/svn/trunk/html5shiv-printshiv.js"></script>
         <![endif]-->
         <!-- Internes CSS ("type="text/css" ist unter HTML5 nicht erforderlich) -->
         <style>
         /*Grundeinstellungen*/
         @media all {
            * {
               box-sizing: border-box;
            }
            body {
               padding: 0;
            }
            /*Für IE 11*/
            main {
               display: block;
            }
         }
         /*Spezielle Einstellungen*/
         @media all {
            div {
               overflow: hidden;
               height: 1750px;
               position: relative;
            }
            iframe {
               border: 0;
               position: absolute;
               top: -800px;
               width: 100%;
               height: 2550px;
            }
         }
         @media only screen and (max-width: 1230px) {
            div {
               height: 1800px;
            }
            iframe {
               top: -670px;
               height: 2650px;
            }
         }
         @media only screen and (max-width: 1024px) {
            div {
               height: 2200px;
            }
            iframe {
               top: -630px;
               height: 2850px;
            }
         }
         </style>
      </head>
      <body>
         <h1>iFrame</h1>
         <p>Von einem eingebundenem iFrame soll der obere Rand abgedeckt werden.</p>
         <p>Dies kann geschen, indem das iFrame in ein div (oder anderen passenden Container) eingebettet wird. Das div bekommt die CSS-Attribute "position: relative;" und "overflow: hidden;".</p>
         <p>Das iFrame das Attribut "position: absolute;".</p>
         <p>Anschließend werden beide mit "height" und das iFrame mit "top" so angepasst, dass vom iFrame oben und (und ggf. unten) der unerwünschte Inhalt abgeschnitten wird. Falls das iFrame bei Änderung der Fensterbreite seine Höhe ändert kann dass über Media Queries ausgeglichen werden. Durch den negativen top-Wert wird das iFrame über das div hinaus nach oben verschoben und durch das overflow wird der nach oben hinausgeschobene Inhalt nicht angezeigt.</p>
         <p>Dieses Beispiel benötigt noch etwas Feintuning und es sind bislang nur drei Fensterbreiten berücksichtigt.</p>
         <div>
            <iframe src="http://www.nordelektrik.de/prestashop/" name="Shop">
            <p>Ihr Browser kann leider keine eingebetteten Frames anzeigen: Sie können die eingebettete Seite über den folgenden Verweis aufrufen: http://www.sprichwort-des-tages.de/zitat.htm</p>
            </iframe>
         </div>
      </body>
      </html>
      

      Gruss

      MrMurphy

  2. Hi,

    In einem Frame habe ich einen Prestahop eingebunden. Die oberen Shopbedingten Laufbilder z.B. Excepateur würde ich dabei gerne verdecken, da sie nicht auf eine Elektroseite passen. Wenn ich die größe des Frames reduziere, wird nur unten etwas weggeschnitten. Habt Ihr eine Lösung?

    sinnvoller als die Bilder durch Beschneiden des Frames nicht mehr anzuzeigen wäre es doch wohl, die gar nicht erst zur Anzeige zu bringen.

    Du solltest also das Template für die Seite bearbeiten und den störenden Teil rausnehmen.

    Oder die Bilder/Texte durch Deine eigenen ersetzen (daß "Lorem ipsum ..." angezeigt wird, deutet doch darauf hin, daß das Platzhalter für eigene Inhalte sind).

    cu,
    Andreas a/k/a MudGuard