CIO Tech Eksperten IT-JOB IT-Kurser Events Podcast Søg
Cookie ikon
Avatar billede Slawomir Seniormester
12. juli 2014 - 21:44 Der er 9 kommentarer og
1 løsning

hjælp til menu script

Hej

Jeg har brug for lidt hjælp.
1. få den til at fungere ligesom i winamp.com
2. få den til at være synlig uanset hvad for et link man klikker på og det samme med den nederste grå bjælke

er der nogen her der kan hjælpe mig med det ?
på forhånd tak
S









<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
  <meta content="text/html; charset=ISO-8859-1"
http-equiv="content-type">
  <title>index</title>
</head>
<body>
<br style="color: rgb(0, 0, 0);">
<br style="color: rgb(0, 0, 0);">
<br style="color: rgb(0, 0, 0);">
<br style="color: rgb(0, 0, 0);">
<table
style="color: rgb(0, 0, 0); background-color: rgb(255, 255, 255); width: 90%; height: 70px; text-align: left; margin-left: auto; margin-right: auto;"
border="0" cellpadding="0" cellspacing="0">
  <tbody>
    <tr style="font-family: Arial;">
      <td
style="text-align: left; vertical-align: top; background-color: rgb(255, 255, 255);">
      <table
style="width: 100%; height: 80px; text-align: left; margin-left: auto; margin-right: auto;"
border="0" cellpadding="0" cellspacing="0">
        <caption></caption> <tbody>
          <tr>
            <td
style="vertical-align: middle; text-align: center; font-weight: bold; background-color: rgb(235, 235, 235);"><big><big>1</big></big></td>
            <td onmouseout="this.bgColor='#ffff00'"
onmouseover="this.bgColor='#E4E400'"
style="width: 160px; font-weight: bold; text-align: center;"
bgcolor="#ffff00"> <big><big>2</big></big></td>
            <td onmouseout="this.bgColor='#FF6600'"
onmouseover="this.bgColor='DC5800'"
style="text-align: center; width: 160px; font-weight: bold;"
bgcolor="#ff6600"><big><big>3</big></big></td>
            <td onmouseout="this.bgColor='#cc0000'"
onmouseover="this.bgColor='#B80000'"
style="text-align: center; width: 160px; font-weight: bold;"
bgcolor="#cc0000">&nbsp;&nbsp;<big><big>4</big></big></td>
            <td onmouseout="this.bgColor='#3333FF'"
onmouseover="this.bgColor='#2727C6'"
style="text-align: center; width: 160px; font-weight: bold;"
bgcolor="#3333ff"><big><big>5</big></big></td>
            <td onmouseout="this.bgColor='#00CC00'"
onmouseover="this.bgColor='#009900'"
style="text-align: center; width: 160px; font-weight: bold;"
bgcolor="#00cc00">&nbsp;<big><big>6</big></big></td>
          </tr>
        </tbody>
      </table>
      <br>
      <br>
test<br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <table style="text-align: left; width: 100%; height: 80px;"
border="0" cellpadding="0" cellspacing="0">
        <tbody>
          <tr>
            <td
style="width: 153px; font-weight: bold; text-align: left;"
onmouseover="this.bgColor='#E4E400'"
onmouseout="this.bgColor='#ffff00'" bgcolor="#ffff00">
            <big style="font-weight: bold;"><big>&nbsp;<big>2</big></big></big></td>
          </tr>
        </tbody>
      </table>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <div style="text-align: right;">Top</div>
      <table style="text-align: left; width: 100%; height: 80px;"
border="0" cellpadding="0" cellspacing="0">
        <tbody>
          <tr>
            <td
style="width: 153px; font-weight: bold; text-align: left;"
onmouseover="this.bgColor='DC5800'"
onmouseout="this.bgColor='#FF6600'" bgcolor="#ff6600">
            <big><big>&nbsp;<big>3</big></big></big></td>
          </tr>
        </tbody>
      </table>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <div style="text-align: right;">Top</div>
      <table style="text-align: left; width: 100%; height: 80px;"
border="0" cellpadding="0" cellspacing="0">
        <tbody>
          <tr>
            <td
style="width: 153px; font-weight: bold; text-align: left;"
onmouseover="this.bgColor='#B80000'"
onmouseout="this.bgColor='#cc0000'" bgcolor="#cc0000">
            <big><big>&nbsp;<big>4</big></big></big></td>
          </tr>
        </tbody>
      </table>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <div style="text-align: right;">Top</div>
      <table style="text-align: left; width: 100%; height: 80px;"
border="0" cellpadding="0" cellspacing="0">
        <tbody>
          <tr>
            <td
style="width: 153px; font-weight: bold; text-align: left;"
onmouseover="this.bgColor='#2727C6'"
onmouseout="this.bgColor='#3333FF'" bgcolor="#3333ff">
            <big><big>&nbsp;<big>5</big></big></big></td>
          </tr>
        </tbody>
      </table>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <div style="text-align: right;">Top</div>
      <table style="text-align: left; width: 100%; height: 80px;"
border="0" cellpadding="0" cellspacing="0">
        <tbody>
          <tr>
            <td
style="width: 153px; font-weight: bold; text-align: left;"
onmouseover="this.bgColor='#009900'"
onmouseout="this.bgColor='#00CC00'" bgcolor="#00cc00">
            <big><big>&nbsp;<big>6</big></big></big></td>
          </tr>
        </tbody>
      </table>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <div style="text-align: right;">Top</div>
      </td>
    </tr>
    <tr>
      <td
style="text-align: left; vertical-align: top; background-color: rgb(204, 204, 204); height: 80px;"><big
style="font-family: Arial;"><big><span
style="font-weight: bold;">gg&nbsp;</span></big></big></td>
    </tr>
  </tbody>
</table>
<br style="color: rgb(0, 0, 0);">
<br style="color: rgb(0, 0, 0);">
<br style="color: rgb(0, 0, 0);">
<br style="color: rgb(0, 0, 0);">
<br style="color: rgb(0, 0, 0);">
<br style="color: rgb(0, 0, 0);">
<br style="color: rgb(0, 0, 0);">
<br style="color: rgb(0, 0, 0);">
<br style="color: rgb(0, 0, 0);">
<br style="color: rgb(0, 0, 0);">
<br style="color: rgb(0, 0, 0);">
</body>
</html>
Avatar billede NielsErikP Mester
12. juli 2014 - 23:17 #1
Hej..

Forstår ikke helt, hvad du mener i 1)...? Hvordan skal den fungere?

Derudover er det rimeligt forældet at opbygge i <table>'s.. opbyg i stedet din menu i <div>.. stylet med css..

Der bruger derudover linje skift "<br>" til at stille dine bjælker op med.. Det holder ikke i retten, du :-) Brug istedt margin og padding.

Forklar lige lidt nærmere, hvad det er du gerne vil have til at ske!
Avatar billede Slawomir Seniormester
13. juli 2014 - 00:12 #2
det jeg mente med 1 var at når man klikker på linket så ruller siden ned til det link man klikker på, hvis jeg kunne så havde jeg lavet det med <div> man det her er tegn på hvormeget en nybegynder kan, margin og padding ved jeg ikke hvad er.

Jeg tænkte på at selve menu bjælken skulle være fast på siden og det samme med den nederste bjælke (den grå) det eneste der skal kunne være flybart det er indhold man klikker på.
Avatar billede NielsErikP Mester
13. juli 2014 - 11:12 #3
Hej...


prøv at bruge anker tagget  :



<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
            "http://www.w3.org/TR/html4/strict.dtd">

<html>
<head>
<style src="txt/css">
#d1  {

    margin-top: 30px;
    width: 50px;
    height: 50px;   
    border: 3px solid black;
    background-color: red;
}
#d2  {
    margin-top: 700px;
    width: 50px;
    height: 50px;
    border: 3px solid black;
    background: blue;
}
#d3 {

    margin-top: 700px;
    width: 50px;
    height: 50px;   
    border: 3px solid black;
    background-color: green;
}
#d4{

    margin-top: 700px;
    width: 50px;
    height: 50px;   
    border: 3px solid black;
    background-color: yellow;
}
</style>       
</head>

<body>
    <div id="menu">
        <ul>
            <li><a href="#d1">1 </a></li>
            <li><a href="#d2">2 </a></li>
            <li><a href="#d3">3 </a></li>
            <li><a href="#d4">4 </a></li>
        </ul>   
    </div>
   
    <div id="d1">
        <h1>1</h1>
    </div>
   
    <div id="d2">
        <h1>2 </h1>
    </div>
   
    <div id="d3">
        <h1>3</h1>
    </div>
   
    <div id="d4">
        <h1>4 </h1>
    </div>
   
</body>       
</html>




Håber du kan bruge det.
Avatar billede NielsErikP Mester
13. juli 2014 - 11:25 #4
Hej igen...

Og så prøv at bruge div's...div's er bare en tom kasse som du så styler ligesom du har gjort med dine <table>, <td> og <tr>...

Prøv i stedet for at lave dine mellemrum med en masse <br> at bruge margin-top: ?px og margin-bottom: ?px..+ margin-right: ?px og margin left: ?px...
Short-cut:  margin: (top)px (right)px (bottom)px (left)px;

eks:  margin: 50px 25px 50px 25px... 50pixels i top og bund og 25 pixels i højre og venstre side.

Håber du kan bruge det.
Avatar billede thomas Praktikant
13. juli 2014 - 13:58 #5
Det kan være en god ide at investere nogle timer på at lære og forstå grundene af HTML og CSS. Der er rigtigt mange gode sted online som f.eks. http://www.codecademy.com/tracks/web der starter fra grunden.
Avatar billede Slawomir Seniormester
13. juli 2014 - 16:14 #6
Niels er det muligt at lave det sådan at når man flytter musen over på blå boks så hele boksen bliver til et link i stedetfor at det er tekst link?
Avatar billede NielsErikP Mester
13. juli 2014 - 23:20 #7
Hej..

@Slawomir:  Igen må du nok forklarer dig lidt nærmere!!  Men ja man kan angive f.eks et billede som et link.
Avatar billede Slawomir Seniormester
17. juli 2014 - 17:29 #8
@Niels jeg håber at dette kan forklar lidt hvad jeg har et ønske om http://postimg.org/image/w7jzt456j/ dette er dog kun et skitse
Avatar billede Slawomir Seniormester
17. juli 2014 - 17:46 #9
wtf fandt lige denne som er tæt på http://www.css3templates.co.uk/templates/photo_blurred3/index.html
Avatar billede NielsErikP Mester
17. juli 2014 - 21:57 #10
Hej...

Fandt lige på denne opstilling, så skal du bare css style til dine behov :




<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
            "http://www.w3.org/TR/html4/strict.dtd">

<html>
<head>
<style src="txt/css">
#container {
    width:  105px;
    height:  400px;
    border: 5px solid green;
}
#d1, #d2, #d3 {
    width:  50px;
    height: 50px;
    display: inline-block;
}

#d1  {
    background: red;
}
#d2  {
    background: blue;
}
#d3  {
    background: green;
}
</style>       
</head>

<body>
    <div id="container">
       
        <div id="Menu_div">Div indeholdende dit logo og  menu
            <div id="logo">Div med dit logo"</div>
            <div id="Menu">Div med din menu</div>
        </div>
            <div id="Tekst_div">

                <div id="d1">Div 1</div>
   
                <div id="d2">Div 2</div>
       
                <div id="d3">Div 3</div>
       
            </div>
           
        </div>
    </div>
</body>       
</html>



Håber du kan bruge det.
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
Webudvikling kurser
Vi tilbyder markedets bedste kurser inden for webudvikling
Se alle Webudvikling kurser

Flere spørgsmål fra JavaScript kategorien

Titel Indlæg Oprettet Seneste aktivitet
Returner ikke alt Af ingeman i JavaScript 13 26/06/202414:40 01/07/202417:00
Vis og skjul sektioner - virker kun på den første sektion Af nemlig i JavaScript 4 24/06/202422:50 26/06/202420:33
Hente og gemme Cookies like this. Af DanishBear i JavaScript 6 04/06/202416:23 05/06/202414:23
Ajax - indlæs webside og derefter hente data Af nemlig i JavaScript 4 21/05/202417:19 22/06/202422:07
Disable button efter 1. klik Af nemlig i JavaScript 2 05/05/202415:37 05/05/202416:25
Se alle spørgsmål i kategorien Opret spørgsmål

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.

Opret Log ind

Du kan også logge ind via nedenstående tjenester



Alle kategorier på Eksperten
Seneste spørgsmål Seneste aktivitet
I går 23:37 Hvilket styresystem anvendes i DVD/HDD optager- Af ErikHg i Musik & videoafspillere
I går 15:23 Hvis formular Af Malou i Excel
I går 13:18 genvejstast Af birdbrain i Excel
I går 08:21 Fjernadgang til Access app Af per2edb i Access
I går 08:03 Min pc fryser Af Lucas Jensen i PC
White papers
Flere white papers »


Premium
Teaser billede
Fra 'juniorministerium' til magtfaktor: Digitalisering får udvidet mandat efter Marie Bjerres afgang
Læs mere »
Nyt ministerium overtager del af Center for Cybersikkerhed fra Forsvaret samt håndteringen af NIS2
Norlys ramt af to nedbrud på et døgn: "Vi løber så stærkt, vi kan"
Kom tæt på Danmarks nye digitaliserings-minister: 33-årige Caroline Stage Olsen er tidligere tobaks-lobbyist - har været aktiv i politik siden hun var helt ung
Se alle »
Computerworld
Teaser billede
Verdens største bilproducent ramt af hackerangreb: Sender skylden videre til tredjepart
Læs mere »
Næste måned skifter din iPhones Apple-id til et nyt navn
Nærmest selvkørende: Jeg kørte fra Roskilde til København uden at røre rattet
Test: Denne laptop rammer plet - er utrolig slank men alligevel utrolig stærk
Se alle »
CIO
Teaser billede
Detailkæde har mistet over 65 millioner kroner efter cyberangreb – kræver erstatning fra it-leverandør
Læs mere »
Professor: "Det er på høje tid at opløse virksomhedernes it-afdelinger"
DSB køber cloud-løsning til 420 millioner kroner af hollandsk it-selskab: Skal afløse 30 år gammelt system
Der er under halvt så mange it-specialister i Danmark som regeringen påstår - tæller elektrikere og automekanikere med
Se alle »
Job & Karriere
Teaser billede
Efter 12 år er NNIT's hovedkvarter i Søborg nu ryddet og tomt - alle arbejder hjemme: "Det er med et vist vemod"
Læs mere »
KMD-direktør forlader selskabet: Det skal hun nu
IBM Danmark skifter ud i sin øverste ledelse - her er den nye direktion
Til åbningsfest i det nye NNIT-hovedkontor: ”Som at flytte til New York sammenlignet med der hvor vi kommer fra” - se billederne
Se alle »
White paper
Teaser billede
MDR: Transparent sikkerhed og overvågning i realtid
Læs mere »
Guide: Sådan udvikler du en moderne netværksstrategi
Sæt turbo på din cloudperformance og minimér risikoen for DDoS-angreb
Det behøver ikke at gøre ondt: Sådan gør du livet lettere for kunder med multicloud
Se alle »

Events
Flere events »
White papers
Flere white papers »
IT-Kurser
Se alle vores it-kurser »