Ergebnis 1 bis 4 von 4

Thema: ein kleines js-script

  1. #1
    Interessierte/r
    Registriert seit
    11.04.2005
    Ort
    lyss, schweiz
    Beiträge
    119
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard ein kleines js-script

    Guten Morgen

    Ich möchte ein JS-Script machen, welches mir mit einem Auslöser ein Overlay generiert und ein Bild lädt. (ähnlich wie lightbox, nur einfacher)

    mit einem kleinen Button soll das Overlay wieder verschwinden.

    PHP-Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <
    html xmlns="http://www.w3.org/1999/xhtml">
    <
    head>
    <
    meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <
    title>Untitled Document</title>
    <
    style type="text/css">
    <!--
    .
    ausloeser {
    position:relative;
    background-color#009900;
    height30px;
    width30px;
    z-index:1;
    }
    .
    Box1 {
    position:absolute;
    top:0px;
    left:0px;
    width:100%;
    height:100%;
    background-image:url(transparent.png);
    z-index:2;
    }
    .
    BoxHead {
     
    position:absolute;
     
    background-color:#FFFFFF;
     
     
    width:800px;
     
    left:20%;
     
    right:20%;
     
    top:40px;
     
    z-index:3;
    }
    .
    BoxClose {
    position:relative;
    left:-20px;
    background-image:url(close.jpg);
    height:16px;
    width:16px;
    }
    -->
    </
    style>
    <
    script  type="text/javascript">
    <!--
    function 
    bild(posImDOM
    {
     var 
    myDIV1 document.createElement("DIV");
     
    myDIV1.className="Box1";
     
    myDIV1.id="Box";
     var 
    myDIV2 document.createElement("DIV");
     
    myDIV2.className="BoxHead";
     var 
    myDIV3 document.createElement("DIV");
     
    var 
    newAttr document.createAttribute("background");
         
    newAttr.nodeValue "body.jpg"
         
    myDIV2.setAttributeNode(newAttr);
         
    var 
    newAttr1 document.createAttribute("onClick");
         
    newAttr1.nodeValue "wegMitEintrag()"
         
    myDIV3.setAttributeNode(newAttr1);
     
     
    myDIV3.className="BoxClose";
     
    myDIV2.appendChild(myDIV3);
     
    myDIV1.appendChild(myDIV2);
     
    document.body.insertBefore(myDIV1posImDOM);
    }
    function 
    wegMitEintrag() {
      var 
    Knoten document.getElementById("Box")[0].firstChild;
      
    verschwunden document.removeChild(Knoten);
      
    alert(verschwunden.firstChild.nodeValue)
    }

    //-->
    </script>
    </head>

    <body>
    <div class="ausloeser" onclick="bild(this)"></div>
    </body>
    </html> 
    Die Div's legt es eigentlich ordentlich an, die Attribute werden auch korrekt eingefügt. Allerdings wird das bild (als background eingefügt) irgendwie ignoriert.

    Wie ich das Overlay wieder verschwinden lassen kann, habe ich noch keinen guten Ansatz. Kann mir jemand helfen?

    Vielen Dank!
    Achtung: Dies ist ein alter Thread im HTML und Webmaster Forum
    Diese Diskussion ist älter als 90 Tage. Die darin enthaltenen Informationen sind möglicherweise nicht mehr aktuell. Erstelle bitte zu deiner Frage ein neues Thema im Forum !!!!!
    ...::: Hat uns Gott ein Hirn gegeben, damit wir erkennen können, dass es ihn nicht gibt? :::...

  2. #2
    Jedi Ritter Avatar von Dodo
    Registriert seit
    26.04.2008
    Ort
    Wien
    Alter
    27
    Beiträge
    3.774
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings
    Blog-Einträge
    1

    Standard AW: ein kleines js-script

    änder das:
    Code:
    var newAttr = document.createAttribute("background");
         newAttr.nodeValue = "body.jpg"
         myDIV2.setAttributeNode(newAttr);
    auf das:
    Code:
    myDIV2.style.backgroundImage = 'url(body.jpg)';
    Something big is coming. And there will be pirates and ninjas and unicorns...

  3. #3
    Interessierte/r
    Themenstarter

    Registriert seit
    11.04.2005
    Ort
    lyss, schweiz
    Beiträge
    119
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard AW: ein kleines js-script

    Super, Herzlichen Dank!

    Weiss jemand wie die Funktion zum löschen des Divs aussehen müsste?

    PHP-Code:
    function loeschen() {
    var 
    sp document.getElementById(Box);
    sp.parentNode.removeChild(sp);

    funktioniert nicht...
    ...::: Hat uns Gott ein Hirn gegeben, damit wir erkennen können, dass es ihn nicht gibt? :::...

  4. #4
    Interessierte/r
    Themenstarter

    Registriert seit
    11.04.2005
    Ort
    lyss, schweiz
    Beiträge
    119
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard AW: ein kleines js-script

    hat geklappt, danke!
    ...::: Hat uns Gott ein Hirn gegeben, damit wir erkennen können, dass es ihn nicht gibt? :::...

Ähnliche Themen

  1. Kleines Script zur Bildschirmanpassung
    Von Tobse im Forum Script-Archiv
    Antworten: 4
    Letzter Beitrag: 14.04.2009, 18:02
  2. Directory-Traversal-Lücke - ist mein kleines Script sicher?
    Von felixstoessel im Forum PHP Forum - Apache - CGI - Perl - JavaScript und Co.
    Antworten: 5
    Letzter Beitrag: 05.02.2008, 15:29
  3. Kleines Java-Script gesucht (Links färben nach anklicken...)
    Von Speck im Forum PHP Forum - Apache - CGI - Perl - JavaScript und Co.
    Antworten: 24
    Letzter Beitrag: 07.08.2006, 23:55
  4. Kleines Script
    Von Gast im Forum PHP Forum - Apache - CGI - Perl - JavaScript und Co.
    Antworten: 6
    Letzter Beitrag: 05.11.2005, 13:04
  5. kleines problem mit nem java script menü
    Von Knüps im Forum PHP Forum - Apache - CGI - Perl - JavaScript und Co.
    Antworten: 2
    Letzter Beitrag: 18.08.2005, 20:08

Stichworte

Berechtigungen

  • Neue Themen erstellen: Nein
  • Themen beantworten: Nein
  • Anhänge hochladen: Nein
  • Beiträge bearbeiten: Nein
  •