Søg
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
Åbne en PDF fil fra en mappe Af mbl i JavaScript 9 18/04/202516:52 22/04/202512:33
Spørgsmål til cookies Af Mads i JavaScript 2 14/02/202511:47 27/06/202514:34
Sæt vindue størrelse Af poulmadsen i JavaScript 1 08/10/202417:18 13/10/202412:33
Opgavestyring Af ingeman i JavaScript 1 15/09/202416:06 15/09/202420:40
Returner ikke alt Af ingeman i JavaScript 13 26/06/202414:40 01/07/202417:00
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
IT-JOB

Netcompany A/S

Data Management Consultant

Netcompany A/S

Erfaren Linux Operations Engineer

Zealand – Sjællands Erhvervsakademi S/I

Fagligt stærk leder af IT-afdelingen

Forsvarsministeriets Materiel- og Indkøbsstyrelse

Driftsstærk IT-profil

Jyske Bank

IT-tekniker til Kapitalmarked
Seneste spørgsmål Seneste aktivitet
I dag 16:31 Google fake Af johp i Andet sikkerhed
I går 20:15 Mesenger - Gendan chathistorik Af 1Dorte i Apps til Android
I går 17:02 lukkede cookies i microsoft edge Af ole falsted i Browsere
I går 14:02 Tage et billede om dagen iPhone 7 Af chiefbigchief i Mobiltelefoner
I går 13:49 Mp3 afspiller med phono stik og display Af cht22 i Andet hardware
White papers
Flere white papers »