Avatar billede none_profit Nybegynder
19. februar 2006 - 10:30 Der er 11 kommentarer og
1 løsning

Select og Object

Hey.
Tænkte på om nogen vidste hvordan man får et <Object> og en <Select> til at lægge sig bagved f.eks. en Div placeret <table>.

jeg har prøvet at flytte rundt på hvilke koder der kommer først i dokumentet, og jeg har også prøvet med z-index, men intet af det virer. De to vil bare ligge oven over ALT andet...
Avatar billede milandt Nybegynder
19. februar 2006 - 13:51 #1
I Internet Explorer, vil et select element altid ligge øverst, pga den måde IE renderer siden på. Elementer som et select element bliver i IE simpelthen "lagt" oven på siden når alt andet er renderet. Det er beklageligt, men der er ikke så meget at gøre ved det..

Og dog..

Du kan "løse" problemet med javascript, men jeg vil ikke udelukke at dette giver dig andre problemer.

Prøv at se på denne side:
http://www.pengepriser.dk/Modelhusstande/Specifikation.htm?mId=f0f5c006-98ec-43e6-8412-710f91d5f4e3&&cId=2a1f95b0-9fbb-42b9-acc7-b070c050d51f

Læg mærke til de to røde [i] ikoner, ud for de to select elementer øverst på siden. Når du klikker på dem, dækker de over select elementerne.

Måden dette er lavet på, er at javascript går ind og laver en iframe i samme størrelse som den røde info-box, som den så placerer absolut under infoboxen. En iframe må nemlig gerne dække over et select element, og et div element må gerne lægge sig ind over en iframe.. problem solved :D

Du kan leeche funktionerne i js-filen fra pengepriser.dk, eller skrive din egen. Hvis du har kendskab til javascript burde det ikke være noget problem, og det burde give mening.. når bare du kender princippet i hvad der sker.
Avatar billede none_profit Nybegynder
19. februar 2006 - 23:22 #2
Ja det er typisk MS at lave det sådan, uden en ekstra funktion til at lave det om.
Men takker for hjælpen, tror jeg kan lave noget lignende selv :)
Avatar billede milandt Nybegynder
20. februar 2006 - 10:24 #3
Cool. Lad mig vide om du får det til at virke - og hvis du har spørgsmål til hvordan funktionerne på Pengepriser.dk virker, så spørg endelig. Så kan jeg pointe nogen ting ud.
Avatar billede none_profit Nybegynder
20. februar 2006 - 19:54 #4
he he.
Fik det til at virke.
Tog godt nok også en halv nat og en dag.
Det var lidt mere udsordring end jeg regnede med i starten.

Men hvis du ikke har noget imod et lille bitte spørgsmål mere...
Hvis Div elementet bliver placeret over en <object> DOM Edit Blok, så blinker den.
Hvorfor, og kan man gøre noget ved det.???

Div elementet kommer ganske vist øverst når man bruger den Iframe metode, det er rart, bare lige det blinkeri der undre mig. Kommer mest hvis man bevæger musen hen over det...
Avatar billede milandt Nybegynder
21. februar 2006 - 01:31 #5
hmm.. det ved jeg ikke på stående fod.. har du et "working example", så skal jeg se om jeg kan give en forklaring på det.

det er dit object element der blinker?
Avatar billede none_profit Nybegynder
21. februar 2006 - 09:25 #6
<OBJECT classid="clsid:2D360201-FFF5-11d1-8D03-00A0C959BC0A" ID="EDBLK" HEIGHT="220" WIDTH="100%" CODEBASE="DHTMLED.CAB#Version=6,1,0,8244">
<param name=ActivateDTCs value=false>
<param name=ActivateActiveXControls  value=false>
<param name=ActivateApplets  value=false>
</OBJECT>


Så har jeg en Div placeret Tabel med Smileys som placere sig hen over objectet.
og så lægger javascriptet som du sagde, et Iframe bagved tabelen så den ikke lægger sig bagved, men foran objectet. Og det virker fint, bortset fra at tabellen så blinker :)

Ovenover har jeg en anden tabel med en menu til objectet.
Smiley tabellen lægger sig halvt over menuen, og halv over objectet. Og det kun den del der ligger hen over objectet, altså halvdelen af tabelen der blinker
Avatar billede milandt Nybegynder
21. februar 2006 - 10:51 #7
men... har du et eksempel på alt det du lige beskrev? hvor jeg kan se din kode?
Avatar billede none_profit Nybegynder
21. februar 2006 - 12:58 #8
<html>
<head>

<script LANGUAGE="JAVASCRIPT" TYPE="text/javascript">
<!--Hide

        function Generate_SmileyFrame() {

        var jvsTable = 'smileys'
        var jvsFrame = 'SmileysFrame';

        if(document.getElementById(jvsTable)) {
            tmpTable = document.getElementById(jvsTable);
            tmpTable.style.display = 'block';

                if(!document.getElementById(jvsFrame)){
                    var ctaFrame = document.createElement('iframe');
                    ctaFrame.id = jvsFrame;
                    ctaFrame.className = jvsFrame;
                    ctaFrame.src = "about:blank";
                    ctaFrame.scrolling = "no";
                    document.getElementById("FramePos").appendChild(ctaFrame);
                }

                        tmpFrame = document.getElementById(jvsFrame)
                        tmpFrame.style.height = tmpTable.offsetHeight;
                        tmpFrame.style.width = tmpTable.offsetWidth;
                        tmpFrame.style.display = 'none';
                        tmpFrame.style.position = 'absolute';
                        tmpFrame.style.top = fncTopLeft(tmpTable,'Top');
                        tmpFrame.style.left = fncTopLeft(tmpTable,'Left');

                        tmpTable.style.display = 'none';
                    }
            else {
                setTimeout("Generate_SmileyFrame()",100);
                }
        }


        function fncTopLeft(obj,TopLeft){
            var jvsTop = 0;
            var jvsLeft = 0;

            if (obj.offsetParent){
                while (obj.offsetParent){
                    jvsTop += obj.offsetTop
                    jvsLeft += obj.offsetLeft
                    obj = obj.offsetParent;
                }
            }
            else {
                if(obj.y) jvsTop += obj.y;
                if(obj.x) jvsLeft += obj.x;
                }

            if(TopLeft == 'Top') return jvsTop;
            if(TopLeft == 'Left') return jvsLeft;
        }


    function Show_Smiley() {

    var jvsTable = document.getElementById('Smileys').style.display

        if (jvsTable == 'none') {
        document.getElementById('Smileys').style.display='block';
        document.getElementById('SmileysFrame').style.display='block';
        }

            else {
            document.getElementById('Smileys').style.display='none';
            document.getElementById('SmileysFrame').style.display='none';
            }
    }

// End hide -->
</script>

<!--#include file="../SCSS512.asp"-->
<!--#include file="../SI0905/SC-X004.asp"-->
<!--#include file="../SI0905/JS-X003.asp"-->

</head>

<body onload="Generate_SmileyFrame();">

<div id="FramePos"></div>

<table class="Toolbar" bgcolor='<%=sysTdColorDark%>' cellpadding="0" cellspacing="0" border="0" width='100%' >
<tr>
<td width='100%' class='NormTekst' align='center'><%=intWeekDay%>&nbsp;d.&nbsp;<%=intDayOfMonth%>&nbsp;<%=strMonth%>&nbsp;<%=intYear%></td>
</tr>
<tr>
<td width='100%' class='NormTekst'><a href="java script:onClick=Show_Smiley();"><img src='<%=sysRoot%>/PI0907/Smileys.gif' border='0'><img src='<%=sysRoot%>/PI0907/Arrow.gif' border='0'></a></td>
</tr>
</table>

<OBJECT classid="clsid:2D360201-FFF5-11d1-8D03-00A0C959BC0A"
        ID="edObj"
        HEIGHT=220 WIDTH=100%
        CODEBASE="DHTMLED.CAB#Version=6,1,0,8244">
<param name=ActivateDTCs value=false>
<param name=ActivateActiveXControls  value=false>
<param name=ActivateApplets  value=false>
</OBJECT>

<div id='smileys' style='display:none'>
<table border='1' cellspacing='0' bordercolor='#000000' width='200' style='border-collapse: collapse' bgcolor='<%=sysSicBgColor%>'>
<tr><td>
<table border='0' cellspacing='1' cellpadding='2' width='100%'>
<tr>
<td width='100%' bgcolor='<%=sysTdColorDark%>' class='BoldTekst' align='center'><strong>Smileys</strong></td>
</tr>
<tr>
<td width='100%' bgcolor='<%=sysTdColorLight%>' class='NormTekst' align='center'><%=Generate_Smileys()%></td>
</tr>
</table>
</td></tr>
</table>
</div>

</body>
</html>

________________________________________________________________________

Det er som min test fil ser ud
Avatar billede milandt Nybegynder
21. februar 2006 - 13:49 #9
Har du et hostet eksempel? Det giver ikke så meget mening bare at copy paste dette.

Anyway - det er ikke fordi jeg har før har prøvet at skulle have en div liggende over et object element, kun select elementer. Om problematiken er en anden skal jeg ikke kunne sige.
Avatar billede none_profit Nybegynder
21. februar 2006 - 17:54 #10
Det er ligemeget.
Det blinker når jeg lægger det hele ind på den side jeg er ved at lave, men det blinker ikke på test siden. Så det må have noget at gøre med alt det andet Javascript osv.. jeg har liggende derinde ... Sikkert en eller anden konflikt mellem de nye og gamle scripts

må jeg lige få tjekket igennem. Så vil jeg ikke spilde din tid mere, de point er tjent ind for længe siden :D
Takker mange gange for hjælpen.
Vidste sku ikke lige hvordan jeg skulle få det til at virke :)
Avatar billede milandt Nybegynder
22. februar 2006 - 09:43 #11
Du bliver nok nødt til at cutte det ned i små bidder så. Prøv at få det til at virke som det skal i en html fil der kun indeholder det relavante.

Prøv så at tilføje mere og mere af det oprindelige indtil du støder på problemer.
Avatar billede none_profit Nybegynder
22. februar 2006 - 10:47 #12
ja det må jeg gøre :)
Igen tak for hjælpen...
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
Vi tilbyder markedets bedste kurser inden for webudvikling

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester