Ergebnis 1 bis 6 von 6

Thema: div -verschiebung

  1. #1
    Teeny
    Registriert seit
    27.11.2008
    Beiträge
    48
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard div -verschiebung

    Hallo an alle. Ich sitze hier vor einen Problem und komme nicht weiter.
    Und zwar:

    Mit dem folgenden JS-Code kann ich meine Layer verschieben, was auch gut klappt:

    Code:
    //Bewegung der Layer durch Maus                
                    var objDrag = null;     
                    var mouseX = 0;       
                    var mouseY = 0;      
                    var offX = 0;           
                    var offY = 0;         
      
                    IE = document.all&&!window.opera;
                    DOM = document.getElementById&&!IE;
            
    //initialisierung der Funktion
            function init()
                    {
                        document.onmousemove = doDrag; 
                        document.onmouseover = doDrag;
                        document.onmouseout = doDrag;
                        document.onmouseup = stopDrag;  
                    }
    //start Element
            function startDrag(objElem)
                    {
                        objDrag = objElem;
                        offX = mouseX - objDrag.offsetLeft;
                        offY = mouseY - objDrag.offsetTop;
                    }
    
    //Bewegung des Layers 
            function doDrag(ereignis)
                    {
                        mouseX = (IE) ? window.event.clientX : ereignis.pageX;
                        mouseY = (IE) ? window.event.clientY : ereignis.pageY;
    
                            if (objDrag != null) 
                            {
                                objDrag.style.left = (mouseX - offX) + "px";
                                objDrag.style.top = (mouseY - offY) + "px";
                            }
                    }
    //Stoppen der Bewegung
            function stopDrag(ereignis) 
                    {
                        objDrag = null;
                    }
    Wenn ich nun die div's ziehe, dann rutschen diese mir unter den oberen Rand des Browsers. Dort wo die Symbolleisten vom IE beginnen.

    Wie kann ich das verhindern?

    Danke im vorraus
    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 !!!!!

  2. #2
    Forum Guru Avatar von synaptic
    Registriert seit
    20.06.2007
    Ort
    Butzbach-Wiesental
    Beiträge
    10.901
    Danke
    45
    Bekam 48 mal "Danke" in 46 Postings
    Blog-Einträge
    1

    Standard AW: div -verschiebung

    poste bitte zusätzlich den entsprechenden html-teil...
    dann schau ich mir des heute abend mal an
    akut geht net, weil ich in der schule hocke
    KEIN support via pn, email, messenger oder falsch geposteten threads
    Futter für deine Schnuffelzwerge gibts bei den Schnuffelzwergen TOP Qualität, also klicken und kaufen

  3. #3
    Teeny
    Themenstarter

    Registriert seit
    27.11.2008
    Beiträge
    48
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard AW: div -verschiebung

    Hallo synaptic

    Ich habe noch etwas erweitert. indem ich von der Position ausgehe und abfrage. Wenn diese kleiner 1 ist dann sollte die function beenden. Klappt aber nicht.


    Code:
    /Bewegung der Layer durch Maus                
                    var objDrag = null;     
                    var mouseX = 0;       
                    var mouseY = 0;      
                    var offX = 0;           
                    var offY = 0;         
      
                    IE = document.all&&!window.opera;
                    DOM = document.getElementById&&!IE;
            
    //initialisierung der Funktion
            function init()
                    {
                        document.onmousemove = doDrag; 
                        document.onmouseover = doDrag;
                        document.onmouseout = doDrag;
                        document.onmouseup = stopDrag;  
                    }
    //start Element
            function startDrag(objElem)
                    {
                        objDrag = objElem;
                        offX = mouseX - objDrag.offsetLeft;
                        offY = mouseY - objDrag.offsetTop;
                    }
    
    //Bewegung des Layers 
            function doDrag(ereignis)
                    {
                        mouseX = (IE) ? window.event.clientX : ereignis.pageX;
                        mouseY = (IE) ? window.event.clientY : ereignis.pageY;
                        
                              if (objDrag != null) 
                                {
                                objDrag.style.left = (mouseX - offX) + "px";
                                objDrag.style.top = (mouseY - offY) + "px";
                                window.status = "Box-Position: " + objDrag.style.left + ", " + objDrag.style.top;
                                    if (objDrag.style.left < 1 || objDrag.style.top < 1)
                                        {
                                            objDrag = null;
                                        }
                                }
                    }
    //Stoppen der Bewegung
            function stopDrag(ereignis) 
                    {
                        objDrag = null;
                    }
    der html code:

    Code:
    <body class="frame_ueberlauf" marginheight="0" marginwidth="0" leftmargin="0" rightmargin="0" topmargin="0" bottommargin="0" onload="<?php if ( $_GET['siteId'] == 4 || $_GET['siteId'] == 31 || $_GET['siteId'] == 10 ) { echo "fnc_showLayer();"; }?>init();">
        
        <div class="layerOptions" onmousedown="startDrag(this);" id="divAll" >
            <table width="980" height="600" border="0" cellpadding="0" cellspacing="0">
                <tr>
                    <td class="layer_td_table" width="980" height="18" border="0" cellpadding="0" cellspacing="0">
                        <table width="980" height="15" border="0" cellpadding="0" cellspacing="0">
                            <tr>
                                <td width="980" height="18">
                                    <table class="layer_tab" width="960" height="18" border="0" cellpadding="0" cellspacing="0">
                                        <tr>
                                            <td width="25" height="18"><img src="./images/sem_icon_delete.gif"></td>
                                            <td width="935" height="18"><?php echo fnc_startauswahl ( $_GET['siteId'] , "name" ); ?></td>
                                        </tr>
                                    </table>
                                </td>
                                <td onclick="fnc_schliessen();" width="20" height="18"cellpadding="0" cellspacing="0"><img src="./images/layer_schliessen.jpg" border="0"></td>
                            </tr>
                        </table>
                    </td>
                </tr>
                <tr>
                    <td width="975" cellpadding="2">
                        <iframe src="<?php echo fnc_startauswahl ( $_GET['siteId'] , "seite" ); ?>" class="iframeAll" marginheight="0" marginwidth="0" scrolling="yes" frameborder="0" id="ifr_all" name="iframe_all" resizable="<?php( $_GET['siteId'] , "groesse" );?>"></iframe>
                    </td>
                </tr>
            </table>
        </div>
    Wenn du noch etwas sehen willst dann gib bescheid

    gruß
    Sven

  4. #4
    Forum Guru Avatar von synaptic
    Registriert seit
    20.06.2007
    Ort
    Butzbach-Wiesental
    Beiträge
    10.901
    Danke
    45
    Bekam 48 mal "Danke" in 46 Postings
    Blog-Einträge
    1

    Standard AW: div -verschiebung

    den style bräucht ich noch
    KEIN support via pn, email, messenger oder falsch geposteten threads
    Futter für deine Schnuffelzwerge gibts bei den Schnuffelzwergen TOP Qualität, also klicken und kaufen

  5. #5
    Teeny
    Themenstarter

    Registriert seit
    27.11.2008
    Beiträge
    48
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard AW: div -verschiebung

    Hallo synaptic

    Der Style sieht so aus:

    Code:
    .layerOptions             {
                                position         : absolute;
                                top              : 150px;
                                left             : 150px;
                                width            : 980px;
                                height           : 600px;
                                border           : 1px solid #000000;
                                background-color : #cccccc;
                                z-index          : 1;
                                visibility       : hidden;
                                cursor           : default;
                            }
                            
    .layerOptions_zwei            {
                                position         : absolute;
                                top              : 250px;
                                left             : 200px;
                                width            : 980px;
                                height           : 600px;
                                border           : 1px solid #000000;
                                background-color : #cccccc;
                                z-index          : 2;
                                visibility       : hidden;
                                cursor           : default;
                            }
    
    .iframeAll                {
                                position         : relative;  
                                bottom           : 0px;
                                left             : 0px;
                                width            : 980;
                                height           : 100%;
                                border           : 1px solid #000000;
                                visibility       : hidden;
                            }
                            
    .layer_td_table            {
                               color             :#FFFFFF;
                               font-family       : Verdana;
                               font-size         : 10px;
                               font-weight       : bold;
                               text-decoration   : none;
                               background-image     :url(../images/layer_leiste.jpg);
                            }    
                            
    .layer_tab                {
                               color             :#FFFFFF;
                               font-family       : Tahoma;
                               font-size         : 11px;
                               font-weight       : bold;
                               text-decoration   : none;
                            }
    
    .frame_ueberlauf
                            {
                                overflow          :hidden;
                            }
    Ich komme nicht auf die Lösung, egal wie viele Stunden ich daran sitze.

    Gruß
    Sven

  6. #6
    Forum Guru Avatar von synaptic
    Registriert seit
    20.06.2007
    Ort
    Butzbach-Wiesental
    Beiträge
    10.901
    Danke
    45
    Bekam 48 mal "Danke" in 46 Postings
    Blog-Einträge
    1

    Standard AW: div -verschiebung

    also ich hab mal des ganze php-gedöhnse rausgenommen und des draggen und droppen funzt soweit schon...
    die einzige auffälligkeit, die ich gefunden habe war das das erste div mit dem style .layerOptions auf hidden war.. habs visible gesetzt und da lief des mit dem script....
    und im firefox is des div etwas nach unten und etwas nach rechts gesprungen, konnte aber bisher nicht eingrenzen woran des liegt
    KEIN support via pn, email, messenger oder falsch geposteten threads
    Futter für deine Schnuffelzwerge gibts bei den Schnuffelzwergen TOP Qualität, also klicken und kaufen

Ähnliche Themen

  1. Table-Verschiebung
    Von tjey im Forum HTML & CSS Forum
    Antworten: 12
    Letzter Beitrag: 27.09.2008, 00:12
  2. Verschiebung
    Von im Forum PHP Forum - Apache - CGI - Perl - JavaScript und Co.
    Antworten: 1
    Letzter Beitrag: 07.10.2007, 22:22
  3. Verschiebung des Navibereichs
    Von ad3nau im Forum HTML & CSS Forum
    Antworten: 10
    Letzter Beitrag: 10.07.2006, 08:24
  4. verschiebung für netscape
    Von pr0stAta im Forum HTML & CSS Forum
    Antworten: 4
    Letzter Beitrag: 10.08.2004, 11:12

Stichworte

Berechtigungen

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