Avatar billede jokerper Nybegynder
21. november 2009 - 17:26 Der er 11 kommentarer og
2 løsninger

CSS - nybegynder - link - <div id="menu"> vs. Frameset

Jeg har en opbygning som denne:


<body>
<div id="header">
</div>

<div id="left">
</div>

<div class="content">
</div>

Mit problem er når der i min menu ligger links som jeg gerne vil åbne i <div class="content"></div>.

Jeg har fx
<a href="reg.php"><h6>Ny bruger</h6></a>
som jeg gerne vil have indlæst i min <div class="content"></div>.

Ligesom et framset, hvor man kan indsætte i bestemte frames.

KAN MAN DET - og hvordan???
Avatar billede claes57 Ekspert
21. november 2009 - 18:43 #1
<div class="content"></div>
der skal være en for hvert menu-item, og så skal resten bare puttes i, fx den første som:
<div class="content"><a href="reg.php"><h6>Ny bruger</h6></a></div>

du kan også navngive de enkelte div, og så udfylde undervejs med javascript
<div class="content" id="menu1"></div>
og i javascript så lave noget med
menu1.innerHTML="<a href='reg.php'><h6>Ny bruger</h6></a>"

prøv også lige at se på dette eksempel, og kør lidt rundt med browsers størrelse:

<!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=iso-8859-1" />
<title>Untitled Document</title>
<style type="text/css">
<!--
body {
    margin: 0px;
    padding: 0px;
}
div#header {
    text-align: center;
    background-color: #CCCCCC;
    height: 60px;
    margin: 0px;
    padding: 1px;
}
div#wrapper {
    background: url(test.gif) repeat;
    margin: 0px;
    padding: 0px;
    width: 100%;
}
div#navcol {
    padding: 10px;
    float: left;
    width: 25%;
}
div#main {
    padding: 10px;
    margin-left: 25%;
    margin-right: 27%;
}
div#sidecol {
    float: right;
    width: 25%;
    padding: 10px
}
div#foot {
    border-top: solid #000 1px;
    background-color: #CCCCCC;
    padding: 10px;
    text-align: center;
    clear: both;
}
-->
</style>
</head>
<body>
<div id="header">
    <h1>Header Text</h1>
</div>
<div id="wrapper">
    <div id="navcol">

        <h4>Nav Column</h4>
        <ul>
            <li>Lorem ipsum dolor</li>
            <li>Consectur elit</li>
            <li>Sed do eiusmod tempor</li>
            <li>Ut labore et dolore</li>

            <li>Ut enim ad minim</li>
        </ul>
    </div>
    <div id="sidecol">
        <h4>Starboard Side Column</h4>
        <ul>
            <li>Lorem ipsum dolor</li>

            <li>Consectur elit</li>
            <li>Sed do eiusmod tempor</li>
            <li>Ut labore et dolore</li>
            <li>Ut enim ad mini</li>
        </ul>
    </div>
    <div id="main">

        <h2>Main Content</h2>
        <p>Ut aliquip ex ea commodo consequat. Ullamco laboris nisi velit esse cillum dolore lorem ipsum dolor sit amet. Cupidatat non proident, qui officia deserunt ut enim ad minim veniam. Mollit anim id est laborum. Ut aliquip ex ea commod22o consequat.</p>
        <p>Lorem ipsum dolor sit amet, velit esse cillum dolore in reprehenderit in voluptate. Consectetur adipisicing elit, ut enim ad minim veniam, ut aliquip ex ea commodo consequat. Ullamco laboris nisi duis aute irure dolor. Quis nostrud exercitation duis aute irure dolor sed do eiusmod tempor incididunt.</p>
        <p>In reprehenderit in voluptate lorem ipsum dolor sit amet, sunt in culpa. Mollit anim id est laborum. Ut labore et dolore magna aliqua. Quis nostrud exercitation duis aute irure dolor velit esse cillum dolore. Lorem ipsum dolor sit amet, cupidatat non proident, sed do eiusmod tempor incididunt.</p>
        <p>Ut enim ad minim veniam, mollit anim id est laborum. Velit esse cillum dolore. Eu fugiat nulla pariatur. Quis nostrud exercitation lorem ipsum dolor sit amet, in reprehenderit in voluptate.</p>
    </div>

</div>
<div id="foot">
    <p>Footer text goes here. In reprehenderit in voluptate lorem ipsum dolor sit amet, eu fugiat nulla pariatur. Ullamco laboris nisi ut aliquip ex ea commodo consequat. Sunt in culpa consectetur adipisicing elit, sed do eiusmod tempor incididunt. Velit esse cillum dolore mollit anim id est laborum. </p>
</div>
</body>
</html>
Avatar billede keysersoze Ekspert
21. november 2009 - 19:00 #2
nej - der findes ikke en direkte erstatning til (i)frames. Du kan til nød benytte noget der hedder AJAX, men det er rimelig avanceret og giver en masse ulemper - så da (i)frames ikke bør benyttes må du leve med en fuldt sideskift som på alle andre sider.
Avatar billede werd Nybegynder
21. november 2009 - 20:54 #3
hvad med bare at bruge includes?

Siden er godt nok nødt til at blive genindlæst, men hvis du i de sider du vil have loadet i content framen includer en top og en bund så slipper du for at have menuen stående i alle filer
Avatar billede jokerper Nybegynder
21. november 2009 - 20:55 #4
Hejsa okay, men jeg har fundet en nogenlunde brugbar løsning lige vedr. dette.

Men som I jo nok ved bedre, så skal der nok også dukke nogle problemer op her.

<a href="index.php?page=reg"><img src="image/knap_reg.gif" height="20px" width="100%"></a>
</div>

Denne her kan komme mine links til mine egne sider ind i

<div id="content">
<?php

if (!isset($_GET['page']))include ('foto.php');
else
include ($_GET['page']."."."php");

?>
</div>

Håber I forstår dette - evt. yderligere råd tages imod med glæde.
Avatar billede keysersoze Ekspert
21. november 2009 - 22:57 #5
Det du gør er rigtig nok én måde - men det kan blive en noget uoverskuelig if du ender op med. Godt nok er eksemplet i ASP men tag evt et kig på denne artikel; http://idgnew1.eksperten.dk/guide/1161
Avatar billede werd Nybegynder
22. november 2009 - 12:09 #6
ja det er også en måde at gøre det på - det letter opbygningen en smule, men det giver også nogle ulemper da du ikke har adgang til at smide kode før <html>-tagget da indholdet i sig selv passivt bliver inkluderet. Endvidere bliver du nødt til at sikre de filer der skal inkluderes så disse ikke bliver browset uden resten af siden!

Der er en guide til en lignende metode her: http://www.martin-nielsen.com/dynamiske-sider-med-php-include_47.html

Jeg vil dog stadig foreslå at du manuelt inkluderer en top og en bund på siderne da det er en del lettere at have med at gøre.
Avatar billede keysersoze Ekspert
23. november 2009 - 20:04 #7
Det begrænser på ingen måde - det er kun et spørgsmål om at bygge funktionerne til at modtage et passende antal parametre. Der er heller ingen grund til at "sikre" filerne på noget måde - det skader på absolut ingen måde at folk kan kalde function-siden direkte, der kommer bare ikke noget frem på skærmen (og så er folk selv uden om det - på samme måde som hvis man direkte tilgår en css eller js fil).
Avatar billede keysersoze Ekspert
29. december 2009 - 11:41 #8
lukketid?
Avatar billede jokerper Nybegynder
29. december 2009 - 14:11 #9
ja, men skal vi lige give werd en chance for også at komme med et svar.
Avatar billede werd Nybegynder
29. december 2009 - 16:58 #10
mener jeg havde smidt et svar længere oppe, men ellers her :)
Avatar billede jokerper Nybegynder
29. december 2009 - 17:46 #11
Okay, men tak for hjælpen. Jeg er dog endnu ikke sikker på hvilken metode som jeg vil benytte mig af.
Avatar billede keysersoze Ekspert
29. december 2009 - 17:54 #12
så spørg løs - der er gået over en måned siden din seneste kommentar og det giver os ingen mulighed for at hjælpe.
Avatar billede jokerper Nybegynder
29. december 2009 - 18:39 #13
Ja, det ved jeg godt.

Men har forsøgt med et design som også tager tid, for jeg skal jo være sikker hvordan jeg vil opnå det jeg har i mine tanker med det tekniske.

Så jeg plejer efter noget tid, hvor jeg har arbejdet med et projekt at gennemgå alle mine spm. på eksperten, som opstår undervejs.
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