mediengestalter.info
FAQ :: Mitgliederliste :: MGi Team

Willkommen auf dem Portal für Mediengestalter

Aktuelles Datum und Uhrzeit: Mi 24.04.2024 03:20 Benutzername: Passwort: Auto-Login

Thema: mitlaufende Iframe Werbung auf Seite mit CSS realisieren vom 27.07.2008


Neues Thema eröffnen   Neue Antwort erstellen MGi Foren-Übersicht -> Programmierung -> mitlaufende Iframe Werbung auf Seite mit CSS realisieren
Autor Nachricht
unbekannternr.2
Threadersteller

Dabei seit: 15.04.2008
Ort: -
Alter: -
Geschlecht: -
Verfasst So 27.07.2008 20:29
Titel

mitlaufende Iframe Werbung auf Seite mit CSS realisieren

Antworten mit Zitat Zum Seitenanfang

Hallo,

ich habe schon mal nach einer Lösung gefragt, wie ich einen Iframe in eine Seite impliziere, der dann mitläuft. Dies war auch ohne Weiteres durch folgenden, einfachen Quellcode möglich:

Zitat:
position:fixed im Css.

<style type="text/css">
<!--
IFRAME#myFrameId {
position:fixed;
}
-->
</style>
<iframe src="http://www.google.de" height="300" width="500" id="myFrameId"></iframe>


Leider habe ich es bisher nicht geschafft, dies auf meinen Seiten umzusetzen.

Hoffe jemand kann mir weiterhelfen. Ich würde gern den Streifen auf der rechten Seite nutzen, um mitscrollende Werbung einzubauen bzw. Werbung, die immer im Bild bleibt.

MfG,
unbekannternr.2


Zuletzt bearbeitet von unbekannternr.2 am Mi 13.08.2008 15:28, insgesamt 3-mal bearbeitet
  View user's profile Private Nachricht senden
unbekannternr.2
Threadersteller

Dabei seit: 15.04.2008
Ort: -
Alter: -
Geschlecht: -
Verfasst So 27.07.2008 21:58
Titel

Antworten mit Zitat Zum Seitenanfang

Habe mal den Code vereinfacht und aufs Wesentliche reduziert. Vielleicht hilft das! Seite ist oben verlinkt. Verschiedene Darstellungsprobleme bei Internet Explorer und Firefox.

Zitat:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2 Final//EN">
<HTML>
<HEAD>
<TITLE>Testseite</TITLE>
<!--[if lt IE 8]>
<script src="http://ie7-js.googlecode.com/svn/version/2.0(beta3)/IE8.js" type="text/javascript"></script>
<![endif]-->
<style type="text/css">
body {
margin-top: 0;
margin-left: 0;
background-color: #428ABD;
}
td {font-family: Arial;
font-size: 11pt;
}
a {text-decoration: none; color: black}
.a1 {text-decoration: none; color: red}
.a2 {text-decoration: none; color: blue}
.a3 {text-decoration: none; color: green}
.startlink {text-decoration: underline; color: blue; font-size: 9pt}
.div720 {font-family: Arial;
font-size: 11pt;
background-color: #ffffff;
margin-left: 20px; width: 720px; padding-left: 4px; padding-right: 2px;
}
.header1 {color: #7CADD1;
font-family: verdana;
font-size: 18pt;
font-weight: bold;
text-align: left;
margin-top: 2px;
line-height: 22pt;
padding-left: 4px;
}
.header2 {color: #ffffff;
font-family: verdana;
font-size: 10pt;
font-weight: bold;
background-color: #31678E;
padding-left: 4px;
margin-bottom: 4px;
}
.adresse {color: #000000;
font-size: 11pt;
font-weight: bold;
text-decoration: none;
font-family: arial;
margin-top: 40px;
padding-left: 12px;
border: 0;
}
ul {list-style-type: square; margin-top: 0px; margin-bottom: 0px}
.copy {font-size: 8pt; text-align: right}
.piktotab
{
margin-top: 5px;
padding-left: 12px;
}
IFRAME#myFrameId {
position:fixed;
}
</style>
<base href="http://www.e-biz.de/reisen/">
<meta name="date" content="2008-03-29">
</HEAD>

<BODY>

<div class="div720">

<table border="0" cellspacing="0" cellpadding="0" width="100%"><tr><td>
<table border="0" cellspacing="0" cellpadding="0" width="280" style="table-layout: fixed" align="right"><tr><td height="320">

<img src="http://www.e-biz.de/reisen/strandhotelfewo/startbild.jpg" width="280" border="0" alt=""/>
</td></tr><tr><td>
<iframe FRAMEBORDER=1 WIDTH=280 HEIGHT=80 noresize SCROLLING=no MARGINHEIGHT=0 MARGINWIDTH=0 SRC="http://www.hallo-urlaub.de/inliner.cfm?id=274&xtext=aktuelltext&color=e00000&fontsize=9pt&fontweight=bold&fontstyle=normal&background=ffffff"></iframe>
</td></tr></table>
<div class="header1" style="text-transform: capitalize">Testseite</div>

<div class="adresse">

<b style="font-size: 14pt;">Test</b><br />
<table border="0" cellspacing="0" cellpadding="0" align="right" style="margin-right: 20px"><tr><td valign="top"></td></tr></table>
Adresse 1<br>
Adresse 2<br />
Adresse 3<br />&nbsp;<br />
<hr color="#73A2D5">
<b><div align="center"><font color="blue">LINK</font></div>
<hr color="#73A2D5">

<div style="margin-top: 18px; margin-bottom: 18px; margin-left: 6px; background-color: #ff9; font-family: arial, sans-serif; font-size: 0.9em; font-weight: bold; color: #009; border-left: 3px solid #e00; padding-left: 2px; width: 340px;">Kontakt <br /><div style="font-weight: normal">TEXT TEXT TEXT</div></div>
</div>
</td></tr></table>

<!-- IFRAME WERBUNG -->

<iframe src="http://www.google.de" height="500" width="150" id="myFrameId"></iframe>


<div class="header2"><!--ip6273569428-->Überschrift<!--/ip6273569428--></div>
TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT ...

<p>
<div align="center"><img src="gifs/pinred.gif" width=21 height=21 border="0" hspace="5">
<b>Gerne senden wir Ihnen, per E-Mail einen Link zu mehr Infos, Bildern und Preisen <br>oder unseren Prospekt <!--mit
Gastgeberverzeichnis-->an Ihre Postadresse. <br>Bitte benutzen Sie das Anfragefeld.</b>
</div>

</p>
<br />&nbsp;<br />
<table border="0" width="100%" cellspacing="0" cellpadding="0">
<tr>
<td><iframe FRAMEBORDER=1 WIDTH=312 HEIGHT=200 noresize SCROLLING=yes MARGINHEIGHT=0 MARGINWIDTH=0 SRC="http://www.hallo-urlaub.de/inliner.cfm?id=274&xtext=schnaeppchen&color=e00000&fontsize=10pt&fontweight=bold&fontstyle=normal&background=ffffff"></iframe></td>

<td align="right"><IFRAME frameborder="0" WIDTH=380 HEIGHT=200 NORESIZE SCROLLING=No FRAMEBORDER=0 MARGINHEIGHT=0 MARGINWIDTH=0 SRC="http://www.urlaubstip.de/_kontakt/kontakt.cfm?id=274"></IFRAME></td>
</tr>
</table>
<!--copy+flash-->

</BODY>
</HTML>
  View user's profile Private Nachricht senden
Anzeige
Anzeige
Snifferdog

Dabei seit: 08.03.2007
Ort: Düsseldorf
Alter: 35
Geschlecht: Männlich
Verfasst Mo 28.07.2008 09:19
Titel

Antworten mit Zitat Zum Seitenanfang

Hi,

also für mich gehört da ein Leerzeichen zwischen.

Code:
IFRAME #myFrameId


Denke mal, dass es daran liegen wird.

Gruß
  View user's profile Private Nachricht senden Website dieses Benutzers besuchen
sahnemuh

Dabei seit: 19.06.2003
Ort: /dev/null
Alter: 42
Geschlecht: Männlich
Verfasst Mo 28.07.2008 09:44
Titel

Antworten mit Zitat Zum Seitenanfang

Snifferdog hat geschrieben:
Hi,

also für mich gehört da ein Leerzeichen zwischen.

Code:
IFRAME #myFrameId


Denke mal, dass es daran liegen wird.

Gruß


nein. dann wäre es ein iframe innerhalb von myframeID.
so ist es das iframe mit der id myframeID.


Snifferdog hat geschrieben:
Hi,

also für mich gehört da ein Leerzeichen zwischen.

Code:
IFRAME #myFrameId


Denke mal, dass es daran liegen wird.

Gruß


nein. dann wäre es ein iframe innerhalb von myframeID.
so ist es das iframe mit der id myframeID.

// EDIT:

ich hab mir die testseite mal angesehen: funktioniert doch im firefox wunderbar.
der IE versteht position: fixed nicht. da mußt du wohl oder übel das element per
javascript oder mit viel gefummle positionieren.

ich würd das ganze so machen (ja, es ist fugly aber funktioniert, sofern js an ist. ansonsten ist das iframe halt einfach fix):

iframe#myframeID {
position: fixed;
left: 800px;
top: 100px;
}
* html iframe#myframeID {
position: absolute;
top: expression(parseInt(document.body.scrollTop + (document.body.offsetHeight - 100)));
}


Zuletzt bearbeitet von sahnemuh am Mo 28.07.2008 11:47, insgesamt 1-mal bearbeitet
  View user's profile Private Nachricht senden
unbekannternr.2
Threadersteller

Dabei seit: 15.04.2008
Ort: -
Alter: -
Geschlecht: -
Verfasst Mo 28.07.2008 13:08
Titel

Antworten mit Zitat Zum Seitenanfang

Vielen vielen Dank!

Habe es mal so editiert, wie ich es haben wollte. Was bedeutet das Sternchen im CSS (dieses * html...)? Dachte schon ich finde nie eine Lösung.
  View user's profile Private Nachricht senden
Kash

Dabei seit: 07.11.2002
Ort: Schopfheim
Alter: 41
Geschlecht: Männlich
Verfasst Mo 28.07.2008 13:14
Titel

Antworten mit Zitat Zum Seitenanfang

unbekannternr.2 hat geschrieben:
Vielen vielen Dank!

Habe es mal so editiert, wie ich es haben wollte. Was bedeutet das Sternchen im CSS (dieses * html...)? Dachte schon ich finde nie eine Lösung.


anweisungen für ältere Browser (zB IE6)
  View user's profile Private Nachricht senden
unbekannternr.2
Threadersteller

Dabei seit: 15.04.2008
Ort: -
Alter: -
Geschlecht: -
Verfasst Mo 11.08.2008 23:21
Titel

Antworten mit Zitat Zum Seitenanfang

Mmh, so richtig ideal ist das noch nicht. Es bereitet weiterhin Probleme mit dem Internet Explorer. Firefox ist optimal. Leider gestaltet sich das jetzt beim Internet Explorer so, dass mit verschiedenen Bildschirmauflösungen dieser Befehl Offset Probleme macht.

Habe da den Wert - 540 eingegeben und das sah auch in 1024er Auflösung ganz optimal aus, aber bei anderen Auflösungen wurde der Abstand zur Oberkante zu groß. Anderes Phänomen was auftrat: Beim runter scrollen wurde die Scrollbar unendlich lang.

Ganz schön schwer... und immer nur der Internet Explorer. *balla balla*
  View user's profile Private Nachricht senden
 
Ähnliche Themen Wie einen mitscrollenden Iframe realisieren?
eingebundene seite (iframe) per css gestalten
Seite neu laden, iFrame aber nicht?
element in iframe (fremde seite) anpsrechen
Anker in einem iframe von separater Seite aus ansprechen
Zu Iframe verlinken ohne Seite ganz neu zu laden
Neues Thema eröffnen   Neue Antwort erstellen
MGi Foren-Übersicht -> Programmierung


Du kannst keine Beiträge in dieses Forum schreiben.
Du kannst auf Beiträge in diesem Forum nicht antworten.
Du kannst an Umfragen in diesem Forum nicht mitmachen.