Transparenz von 2 boxen

Ryuuzaki93 · 06.07.2010, 19:31

Hi,

ich hab auf meiner Seite 2 boxen, die transparent werden sollen, wenn ich auf einen Link klicke. Die Fehlerkonsole spuckt nix aus, was geht hier nicht?

Skript

Code:

function verschwinden(opacity06_real, diff06, opacity10_real, diff10) {
  opacity06_real = opacity06_real - diff06;  
  opacity06 = Math.round(opacity06_real * 10) / 10;
      
  document.getElementById('error_outbox').style.opacity = opacity06;
  document.getElementById('error_outbox').style.filter = "Alpha(opacity="+opacity06+")";   
  
  opacity10_real = opacity10_real - diff10;  
  opacity10 = Math.round(opacity10_real * 10) / 10;
        
  document.getElementById('error_box').style.opacity = opacity10;
  document.getElementById('error_box').style.filter = "Alpha(opacity="+opacity10+")";  
    
  if(opacity10_real == 0) {
    document.getElementById('error_outbox').style.display = 'none';
    document.getElementById('error_box').style.display = 'none';
    clearInterval(interval);
  }
}

function fehlerschliessen() {
  var zeit = 1000;
  var opacity10_real = 1.0;  
  var opacity06_real = 0.6;
  var diff10 = opacity10_real / zeit;
  var diff06 = opacity06_real / zeit;  

  var intervalzeit = 1000 / zeit;  
  var interval = window.setInterval("verschwinden("+opacity06_real+", "+diff06+", "+opacity10_real+", "+diff10+")", intervalzeit);
}

und die php

PHP-Code:

  switch($_GET['error']) {

  case 1:

    echo "

    <div id=\"error_outbox\" class=\"error_outbox\"></div>

    <div id=\"error_box\" class=\"error_box\" align=\"center\">

    Bitte füllen Sie alle Felder aus!<br>

    <a href=\"javascript:fehlerschliessen();\">Schließen</a>

    </div>

    </div>

    ";

    break;

}

und nochn Auszug aus dem Style-Sheet

Code:

.error_outbox{
  position: absolute;
  left: 0px;
  top: 0px;
  margin: 0px;
  z-index: 20;
  width: 100%;
  height: 100%;
  background-color: black;
  opacity: 0.6;
  filter:alpha(opacity=60);
	-moz-opacity: 0.6;
	-khtml-opacity: 0.6;
}

.error_box{
  position: absolute;
  top: 30%;
  left: 50%;
  margin-left: -250px;
  z-index: 21;
  width: 500px;
  background-color: yellow;
}

BlackScorp · 07.07.2010, 14:29

hier ist die lösung:
PHP:

PHP-Code:

  switch($_GET['error']) {

  case 1:

    echo "

    <div id=\"error_outbox\" class=\"error_outbox\"></div>

    <div id=\"error_box\" class=\"error_box\" align=\"center\">

    Bitte füllen Sie alle Felder aus!<br>

    <div class=\"close\">Schließen</div>

    </div>

    </div>

    ";

    break;

}

HTML:

Code:

<html>
<head>
<!-- irgendwelche sachen -->
  <script src="http://code.jquery.com/jquery-latest.min.js"></script>
</head>
<body>
<script type="text/javascript">
$(document).ready(function(){

  $("div.close").click(function () { //beim click auf schließen div
  $("div.error_outbox").fadeOut("slow"); // lasse langsam das fenster ausblenden
  });
})
</script>
<!-- andere sachen -->
</body>
</html>

.... jetzt "nur" noch auf dein script anpassen
MFG

Ryuuzaki93 · 08.07.2010, 08:50

Danke nur noch 1 Frage: Gibt mit JavaScript auch die möglichkeit die -moz-opacity und die -khtml-opacity anzupassen?

BlackScorp · 08.07.2010, 08:52

wenn du jQuery verwendest... passiert das automatisch jQUery is browserunabhängig

Themen-Optionen
Druckbare Version zeigen Jemanden per E-Mail auf dieses Thema hinweisen
Thema bewerten
Thema bewerten:

Ähnliche Themen
Thema	Autor	Forum	Antworten	Letzter Beitrag
DIV Boxen in IE nicht sichtbar	defcut	HTML, Usability und Barrierefreiheit	1	21.05.2009 11:46
[Erledigt] Datei via Ajax in zwei Boxen laden	Lenni.B	JavaScript, Ajax und mehr	4	25.02.2009 11:28
[Erledigt] Random Image Sig + Transparenz	Sylena	PHP Tipps 2008	18	08.08.2008 12:40
GD: Transparenz erhalten	Zergling-new	PHP Tipps 2007	2	12.06.2007 10:53
2 Boxen nebeneinander, restliche Text unter den Boxen.	PsychoEagle	HTML, Usability und Barrierefreiheit	2	29.03.2007 11:57
Bilder mit Transparenz "umrahmen"	Andreas	PHP-Fortgeschrittene	11	21.12.2006 08:48
imagefillrectangle mit transparenz workaround?	Promaetheus	PHP Tipps 2006	2	20.10.2006 04:46
PNG verliert Transparenz mit imagerotate	imagica	PHP-Fortgeschrittene	3	20.06.2006 15:13
Zwei PNGs mit Transparenz in ein neues Bild koperen!?	blik	PHP Tipps 2006	2	16.04.2006 00:09
JS: Mit einen Link boxen sichtbar und unsichtbar durch klick	scooter	Beitragsarchiv	3	11.03.2006 19:34
transparenz bei png?		PHP Tipps 2005-2	6	02.10.2005 14:53
css - 3 boxen nebereinander	seejay	HTML, Usability und Barrierefreiheit	3	08.08.2005 16:54
GIF als PNG ausgeben: Transparenz verlohren.		PHP-Fortgeschrittene	7	21.11.2004 16:19
CSS boxen lappen übereinander und passen sich nicht an!!!!!!	'progman'	HTML, Usability und Barrierefreiheit	1	20.10.2004 23:47
ausklappbare boxen	Creativ	PHP Tipps 2004	4	04.06.2004 15:18


Mister Ad PHP Code Flüsterer Registriert seit: 21.08.2005 Beiträge: 4682 PHP-Kenntnisse: Fortgeschritten

07.07.2010, 14:29
BlackScorp Erfahrener Benutzer Registriert seit: 25.09.2009 Beiträge: 2.114 PHP-Kenntnisse: Fortgeschritten	hier ist die lösung: PHP: PHP-Code: `switch($_GET['error']) { case 1: echo " <div id=\"error_outbox\" class=\"error_outbox\"></div> <div id=\"error_box\" class=\"error_box\" align=\"center\"> Bitte füllen Sie alle Felder aus!<br> <div class=\"close\">Schließen</div> </div> </div> "; break; }` HTML: Code: <html> <head> <!-- irgendwelche sachen --> <script src="http://code.jquery.com/jquery-latest.min.js"></script> </head> <body> <script type="text/javascript"> $(document).ready(function(){ $("div.close").click(function () { //beim click auf schließen div $("div.error_outbox").fadeOut("slow"); // lasse langsam das fenster ausblenden }); }) </script> <!-- andere sachen --> </body> </html> .... jetzt "nur" noch auf dein script anpassen MFG __________________ Mein kleines Projekt -Cruel Online- 5 von 3 Leuten können kein Bruchrechnen

08.07.2010, 08:50
Ryuuzaki93 Erfahrener Benutzer Registriert seit: 11.12.2009 Beiträge: 117 PHP-Kenntnisse: Fortgeschritten	Danke nur noch 1 Frage: Gibt mit JavaScript auch die möglichkeit die -moz-opacity und die -khtml-opacity anzupassen?

08.07.2010, 08:52
BlackScorp Erfahrener Benutzer Registriert seit: 25.09.2009 Beiträge: 2.114 PHP-Kenntnisse: Fortgeschritten	wenn du jQuery verwendest... passiert das automatisch jQUery is browserunabhängig __________________ Mein kleines Projekt -Cruel Online- 5 von 3 Leuten können kein Bruchrechnen