mediengestalter.info
FAQ :: Mitgliederliste :: MGi Team

Willkommen auf dem Portal für Mediengestalter

Aktuelles Datum und Uhrzeit: Mi 25.05.2022 08:34 Benutzername: Passwort: Auto-Login

Thema: Probleme mit Thickbox overlay vom 04.03.2008


Neues Thema eröffnen   Neue Antwort erstellen MGi Foren-Übersicht -> Allgemeines - Nonprint -> Probleme mit Thickbox overlay
Autor Nachricht
Mäuschen73
Threadersteller

Dabei seit: 04.03.2008
Ort: RLP
Alter: 48
Geschlecht: Weiblich
Verfasst Di 04.03.2008 15:09
Titel

Probleme mit Thickbox overlay

Antworten mit Zitat Zum Seitenanfang

Hallo Ihr alle,
ich bin neu hier und vielleicht könnt ihr mir weiterhelfen.
Ich mache für unseren Verein die Homepage.
Die Homepage ist zentriert 975px breit und nach unten zu scrollen.
Dort sind einige Bilder drauf, die wir mit dem Thickbox-Effekt vergrössert darstellen wollen.
Beim Anklicken wird das Bild zentriert grösser dargestellt und der Rest der Seite ausgegraut.
Das klappt im Firefox wunderbar, aber der IE 6 macht Probleme.
Das Bild wird dargestellt, der Rest ist ausgegraut ... aber das Ausgrauen endet in der Höhe, bis wo man die Seite ohne scrollen sieht. Hat man vorher gescrollt und klickt auf das Bild, endet das Ausgrauen und der Rest der Seite ist normal sichtbar.
Ich habe versucht es in dem thickbox.css einzustellen, habe aber keine Lösung gefunden.
Vielleicht habt ihr eine Idee ?

Der Code meines CSS ist:

body {
height: 100%;
width: 100%;
padding: 0;
margin: 0;
text-align:center;
}

#content {
position: relative;
width: 975px;
height: auto;
margin: 0px auto;
}

Der Thickbox-Code ist:

/* ----------------------------------------------------------------------------------------------------------------*/
/* ---------->>> global settings needed for thickbox <<<-----------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/
*{padding: 0; margin: 0;}

/* ----------------------------------------------------------------------------------------------------------------*/
/* ---------->>> thickbox specific link and font settings <<<------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/
#TB_window {
font: 12px Arial, Helvetica, sans-serif;
color: #333333;
}

#TB_secondLine {
font: 10px Arial, Helvetica, sans-serif;
color:#666666;
}

#TB_window a:link {color: #666666;}
#TB_window a:visited {color: #666666;}
#TB_window a:hover {color: #000;}
#TB_window a:active {color: #666666;}
#TB_window a:focus{color: #666666;}

/* ----------------------------------------------------------------------------------------------------------------*/
/* ---------->>> thickbox settings <<<-----------------------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/
#TB_overlay {
position: fixed;
z-index:100;
top: 0px;
left: 0px;
height:100%;
width:100%;
}

.TB_overlayMacFFBGHack {background: url(macFFBgHack.png) repeat;}
.TB_overlayBG {
background-color:#000;
filter:alpha(opacity=75);
-moz-opacity: 0.75;
opacity: 0.75;
}

* html #TB_overlay { /* ie6 hack */
position: absolute;
height:expression(document.body.scrollHeight > document.body.offsetHeight ? document.body.scrollHeight : document.body.offsetHeight + 'px');
}

#TB_window {
position: fixed;
background: #ffffff;
z-index: 102;
color:#000000;
display:none;
border: 4px solid #525252;
text-align:left;
top:50%;
left:50%;
}

* html #TB_window { /* ie6 hack */
position: absolute;
margin-top: expression(0 - parseInt(this.offsetHeight / 2) + (TBWindowMargin = document.documentElement && document.documentElement.scrollTop || document.body.scrollTop) + 'px');
}

#TB_window img#TB_Image {
display:block;
margin: 15px 0 0 15px;
border-right: 1px solid #ccc;
border-bottom: 1px solid #ccc;
border-top: 1px solid #666;
border-left: 1px solid #666;
}

#TB_caption{
height:25px;
padding:7px 30px 10px 25px;
float:left;
}

#TB_closeWindow{
height:25px;
padding:11px 25px 10px 0;
float:right;
}

#TB_closeAjaxWindow{
padding:7px 10px 5px 0;
margin-bottom:1px;
text-align:right;
float:right;
}

#TB_ajaxWindowTitle{
float:left;
padding:7px 0 5px 10px;
margin-bottom:1px;
}

#TB_title{
background-color:#e8e8e8;
height:27px;
}

#TB_ajaxContent{
clear:both;
padding:2px 15px 15px 15px;
overflow:auto;
text-align:left;
line-height:1.4em;
}

#TB_ajaxContent.TB_modal{
padding:15px;
}

#TB_ajaxContent p{
padding:5px 0px 5px 0px;
}

#TB_load{
position: fixed;
display:none;
height:13px;
width:208px;
z-index:103;
top: 50%;
left: 50%;
margin: -6px 0 0 -104px; /* -height/2 0 0 -width/2 */
}

* html #TB_load { /* ie6 hack */
position: absolute;
margin-top: expression(0 - parseInt(this.offsetHeight / 2) + (TBWindowMargin = document.documentElement && document.documentElement.scrollTop || document.body.scrollTop) + 'px');
}

#TB_HideSelect{
z-index:99;
position:fixed;
top: 0;
left: 0;
background-color:#fff;
border:none;
filter:alpha(opacity=0);
-moz-opacity: 0;
opacity: 0;
height:100%;
width:100%;
}

* html #TB_HideSelect { /* ie6 hack */
position: absolute;
height: expression(document.body.scrollHeight > document.body.offsetHeight ? document.body.scrollHeight : document.body.offsetHeight + 'px');
}

#TB_iframeContent{
clear:both;
border:none;
margin-bottom:-1px;
margin-top:1px;
_margin-bottom:1px;
}


Ich hoffe, ich hab es halbwegs verständlich erklärt. Kann leider keinen Link schicken, da noch nichts online ist.
Würde mich über Lösungsvorschläge sehr freuen, denn ich probiere schon seit 3 Tagen damit herum.

Liebe Grüße Euch allen...weiter so

Mäuschen73
  View user's profile Private Nachricht senden
DevilSide

Dabei seit: 09.10.2004
Ort: -
Alter: -
Geschlecht: -
Verfasst Do 29.05.2008 17:58
Titel

Antworten mit Zitat Zum Seitenanfang

Code:
/* ----------------------------------------------------------------------------------------------------------------*/
/* ---------->>> global settings needed for thickbox <<<-----------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/
#TB_overlay *, #TB_window * {padding: 0; margin: 0;}

/* ----------------------------------------------------------------------------------------------------------------*/
/* ---------->>> thickbox specific link and font settings <<<------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/
#TB_window {
   font: 12px Arial, Helvetica, sans-serif;
   color: #333333;
}

#TB_secondLine {
   font: 10px Arial, Helvetica, sans-serif;
   color:#666666;
}

#TB_window a:link {color: #666666;}
#TB_window a:visited {color: #666666;}
#TB_window a:hover {color: #000;}
#TB_window a:active {color: #666666;}
#TB_window a:focus{color: #666666;}

/* ----------------------------------------------------------------------------------------------------------------*/
/* ---------->>> thickbox settings <<<-----------------------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/
#TB_overlay {
   position:fixed !important;
   z-index:100;
   top: 0px;
   left: 0px;
   height:100%;
   width:100%;
}

.TB_overlayMacFFBGHack {background: url(macFFBgHack.png) repeat;}
.TB_overlayBG {
   background-color:#000000;
   filter:alpha(opacity=75);
   -moz-opacity: 0.75;
   opacity: 0.75;
}

* html #TB_overlay { /* ie6 hack */
     position: absolute;
     height: expression(document.body.scrollHeight > document.body.offsetHeight ? document.body.scrollHeight : document.body.offsetHeight + 'px');
}

#TB_window {
position:fixed !important;
 position:absolute;
   background: #ffffff;
   z-index: 102;
   color:#000000;
   display:none;
   border: 4px solid #525252;
   text-align:left;
   top:50%;
   left:50%;
}

* html #TB_window { /* ie6 hack */
position: absolute;
margin-top: expression(0 - parseInt(this.offsetHeight / 2) + (TBWindowMargin = document.documentElement && document.documentElement.scrollTop || document.body.scrollTop) + 'px');
}

#TB_window img#TB_Image {
   display:block;
   margin: 15px 0 0 15px;
   border-right: 1px solid #ccc;
   border-bottom: 1px solid #ccc;
   border-top: 1px solid #666;
   border-left: 1px solid #666;
}

#TB_caption{
   height:25px;
   padding:7px 30px 10px 25px;
   float:left;
}

#TB_closeWindow{
   height:25px;
   padding:11px 25px 10px 0;
   float:right;
}

#TB_closeAjaxWindow{
   padding:7px 10px 5px 0;
   margin-bottom:1px;
   text-align:right;
   float:right;
}

#TB_ajaxWindowTitle{
   float:left;
   padding:7px 0 5px 10px;
   margin-bottom:1px;
}

#TB_title{
   background-color:#e8e8e8;
   height:27px;
}

#TB_ajaxContent{
   clear:both;
   padding:2px 15px 15px 15px;
   overflow:auto;
   text-align:left;
   line-height:1.4em;
}

#TB_ajaxContent.TB_modal{
   padding:15px;
}

#TB_ajaxContent p{
   padding:5px 0px 5px 0px;
}

#TB_load{
   position: fixed;
   display:none;
   height:13px;
   width:208px;
   z-index:103;
   top: 50%;
   left: 50%;
   margin: -6px 0 0 -104px; /* -height/2 0 0 -width/2 */
}

* html #TB_load { /* ie6 hack */
position: absolute;
margin-top: expression(0 - parseInt(this.offsetHeight / 2) + (TBWindowMargin = document.documentElement && document.documentElement.scrollTop || document.body.scrollTop) + 'px');
}

#TB_HideSelect{
   z-index:99;
   position:fixed;
   top: 0;
   left: 0;
   background-color:#fff;
   border:none;
   filter:alpha(opacity=0);
   -moz-opacity: 0;
   opacity: 0;
   height:100%;
   width:100%;
}

* html #TB_HideSelect { /* ie6 hack */
     position: absolute;
     height: expression(document.body.scrollHeight > document.body.offsetHeight ? document.body.scrollHeight : document.body.offsetHeight + 'px');
}

#TB_iframeContent{
   clear:both;
   border:none;
   margin-bottom:-1px;
   margin-top:1px;
   _margin-bottom:1px;
}



Probiers mal damit
Gruss
  View user's profile Private Nachricht senden
Anzeige
Anzeige
 
Ähnliche Themen (Thickbox) Overlay --> Flash scheint durch
Thickbox
Thickbox Problem
[jQuery] + Thickbox oder nyroModal?
Thickbox mit Zeit und Automatik?
Flash-Film stoppen beim Öffnen einer Thickbox
Neues Thema eröffnen   Neue Antwort erstellen
MGi Foren-Übersicht -> Allgemeines - Nonprint


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.