# Website blockieren bzw. ausgrauen



## meste (14. Februar 2011)

Hallo allerseits,
ich möchte gerne ein PopUp-fenster anzeigen und während der Anzeige die Website im Hintergrund blockieren bzw. ausgrauen so wie hier im Forum wenn man sich abmelden möchte.

Danke und Lg


----------



## ComFreek (14. Februar 2011)

Ich vermute mal deine Frage ist, wie man sowas macht.

Zuerst brauchst du den ausgegrauten Bereich, man nimmt dazu ein DIV und setzt die Farbe z.B. als Grau und die Transparenz auch. Außerdem muss du das DIV als vorderstes Element kennzeichnen (CSS z-index):

```
<div id="divDisabledBackground"></div>
```


```
#divDisabledBackground
{
  z-index:99999;
  background: gray;
  opacity: 0.5;           /* muss man ausprobieren! */
}
```
Dann fehlt noch dein PopUp-Fenster, das auch ein DIV (habe ich jetzt angenommen) ist:

```
<div id="divMyPopup"></div>
```


```
#divMyPopup
{
  z-index:100000;
  /* ...was du willst... */
}
```


----------



## SpiceLab (14. Februar 2011)

ComFreek hat gesagt.:


> Außerdem muss du das DIV als vorderstes Element kennzeichnen (CSS z-index):
> 
> 
> ```
> ...


z-index zeigt ohne jegliche Angabe zur Positionsart position keinerlei Wirkung.

Hier kennt sich jemand gewiß nicht am Besten in Web-Sprachen aus, wie in seiner Signatur vollmundig propagiert


----------



## meste (15. Februar 2011)

@ComFreek
Hat leider nicht geklappt. Der Background ist zwar grau aber nicht disabled.


@spicelab
Was wäre dein Vorshlag?



Lg


----------



## ComFreek (15. Februar 2011)

@spicelab:
Sorry, beim Hintergrund habe ich eben die Position vergessen und left, top.
Beim zweiten schrieb ich ja "_/*...was du willst...*/_", das war auch hinsichtlich der Position gemeint. Ja hier gebe ich zu war nicht ganz so ausführlich...Hatte ich einfach so kurz hingeschrieben.

Übrigens sage ich nicht, dass ich mich am Besten auskenne, sogar von all meinen Kenntnissen von diesen (C++, Websprachen...).
Aber ich muss wirklich gestehen CSS war noch nie meine Stärke. Habs mal rausgenommen 

Und übrigens soll meine Signatur nicht als Werbung dienen


----------



## SpiceLab (17. Februar 2011)

meste hat gesagt.:


> @ComFreek
> Hat leider nicht geklappt. Der Background ist zwar grau aber nicht disabled.
> 
> 
> ...


 

```
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de" lang="de">
    <head>
        <meta http-equiv="content-type" content="text/html; charset=ISO-8859-1" />
        <title>...</title>
        <style type="text/css">
            * {margin:0;padding:0;}
            html,body,#overlayDiv {height:100%;}    
            #overlayDiv {position:fixed;top:0;left:0;z-index:10;width:100%;background:#000;color:#fff;opacity:.8;}
            #overlayDiv p {display:none;}
            #pageDiv {position:relative;z-index:1;}   
        </style>
        <!--[if IE]>
        <style type="text/css">
            #overlayDiv {filter:alpha(opacity=80);}
        </style>
        <![endif]-->
    </head>
    <body> 
        <div id="overlayDiv">
            <p>overlayDiv</p>
        </div>
        <div id="pageDiv"> 
            <p>pageDiv dummy text</p>
            <p>pageDiv dummy text</p>
            <p>pageDiv dummy text</p>
        </div>
    </body>
</html>
```

Der darunter befindliche Text innerhalb  #pageDiv ist "disabled", kann mit dem Mauszeiger nicht erreicht / markiert werden.


----------

