Hvordan få til select i menyen

9 innlegg i emnet

Skrevet

Hei, jeg holder på å koden siden min nå, og skal bruke select i menyen.

Sån at eks. når jeg er inne på "web" så kan du se det i menyen. Med en annen bakgrunn eller noe lignende.

Jeg bruker denne koden for å få til et jquery tabs script. Du ser menyen i starten og innholdet som skal være på siden under.

Åssen får jeg til select?

<div class="tabs">


				<ul class="menu_ul">

					<li><a href="#hjem">Hjem</a></li>

					<li><a href="#web">Web</a></li>

				</ul>



				<div id="hjem">

					<h2>Hjem</h2>


					<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in vollaborum.</p>

				</div>


				<div id="web">


					<h2>Web</h2>


					<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliqui velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>

				</div>


</div>

Takker for svar :lol:

0

Del dette innlegget


Lenke til innlegg
Del på andre sider

Skrevet

Hvis jeg forstår deg riktig.

HTML:

<li><a href="#hjem" id="selected">Hjem</a></li>
CSS:
.menu_ul a#selected {

text-decoration:none;

background-color:#F00;}

0

Del dette innlegget


Lenke til innlegg
Del på andre sider

Skrevet

Hvis jeg forstår deg riktig.

HTML:

<li><a href="#hjem" id="selected">Hjem</a></li>
CSS:
.menu_ul a#selected {

text-decoration:none;

background-color:#F00;}

Nå ble jo alle meny punktene deket med den bakgrunns fargen.

Jeg skal ha det sån at når du eks går inn på "web" så er det bare den som er dekket med den bakgrunns fargen.

0

Del dette innlegget


Lenke til innlegg
Del på andre sider

Skrevet (endret)

Jeg gikk ut fra at du hadde satt opp noe i CSS fra før av. :unsure:

Sett inn dette også i CSS. Du må selvfølgelig sette de fargene du vill ha selv.

.menu_ul a {

	background-color:#000;

	}

Og det er bare den siden du er på som skal ha "id="selected".

Håper dette hjelper. :)

Edit: Sorry glemte en "a" i siste koden.

Endret av LinKri
0

Del dette innlegget


Lenke til innlegg
Del på andre sider

Skrevet

Jeg gikk ut fra at du hadde satt opp noe i CSS fra før av. :unsure:

Sett inn dette også i CSS. Du må selvfølgelig sette de fargene du vill ha selv.

.menu_ul a {

	background-color:#000;

	}
Og det er bare den siden du er på som skal ha "id="selected". Håper dette hjelper. :) Edit: Sorry glemte en "a" i siste koden.
Dette er den css som jeg bruker på siden nå
.menu_ul {

	overflow: hidden;

	width: auto;

	padding: 0;

	list-style-type: none;

	margin: 0 0 28px 30px;

}

.menu_ul li {

	float: left;	

}

.menu_ul a {

background-color:#000;	

display: block;

color: black;

text-decoration: none;

font: bold 15px Arial;

	margin-right: 20px;

	height: 20px;

}

.menu_ul a:hover {

color: black;

font: bold 15px Arial;

	background: url(bilder/strek_over.png) no-repeat center 18px;

	height: 20px;

	margin-top: -2px;

}

.menu_ul a#selected {

text-decoration:none;

background-color:#F00;}

Se om det er noe galt med den.

0

Del dette innlegget


Lenke til innlegg
Del på andre sider

Skrevet

Ser ikke noe galt i CSS en din.

Jeg så først nå at du har noe Jquery script oppi detta også.

Mulig jeg var litt kjapp når jeg leste spørsmålet ditt. :cry

Tror ikke jeg kan bidra med så mye mer uten å se hele opsettet. :(

0

Del dette innlegget


Lenke til innlegg
Del på andre sider

Skrevet (endret)

Kodene ser riktig ut de. Bortsett fra at det skal vel være mellomrom mellom "a" og "#selected" i CSS'n din. Altså:

.menu_ul a #selected {

text-decoration:none;

background-color:#F00;}
Også er det viktig å få frem at "selected" kun skal settes på den aktuelle linken (den som skal vises som valgt). Eks:
<ul class="menu_ul">

		<li><a href="#hjem" id="selected">Hjem</a></li>

		<li><a href="#web">Web</a></li>

</ul>
om ikke det fungerer, så prøver du å sette CSS'n slik:
.menu_ul #selected {

text-decoration:none;

background-color:#F00;}
og HTML'n sånn:
<ul class="menu_ul">

		<li><span id="selected"><a href="#hjem">Hjem</a></span></li>

		<li><a href="#web">Web</a></li>

</ul>

Endret av [x-even-x]
0

Del dette innlegget


Lenke til innlegg
Del på andre sider

Skrevet

Det funket jo dette, men det funker bare på "hjem".

Jeg skal ha det sån når man trykker på de forskjellige meny punktene.

Så blir de til en annen bakgrunnsfarge.

Sån at du eks ser at du er inne på "web" Fordi da er den markert med en annnen bakgrunnsfarge.

0

Del dette innlegget


Lenke til innlegg
Del på andre sider

Skrevet

Selvfølgelig. Du må jo endre HTML koden til hver side. Så i hjem fila skal det være:

<ul class="menu_ul">

        <li><a href="#hjem" id="selected">Hjem</a></li>

         <li><a href="#web">Web</a></li>

</ul>
Men i Web fila skal det være:
<ul class="menu_ul">

        <li><a href="#hjem">Hjem</a></li>

         <li><a href="#web" id="selected">Web</a></li>

</ul>
Ser forresten ut som hele siden har en index fil. Dette kan du da fikse med php script som sjekker URL'n. Hadde det vært index.php?p=hjem ville koden sett ut:
if ($_GET['p'] = "hjem") {

echo '<ul class="menu_ul">

        <li><a href="#hjem" id="selected">Hjem</a></li>

         <li><a href="#web">Web</a></li>

</ul>';

}

elseif ($_GET['p'] = "web") {

echo '<ul class="menu_ul">

        <li><a href="#hjem">Hjem</a></li>

         <li><a href="#web" id="selected">Web</a></li>

</ul>';

}

Se om du klarer å tilpasse den til din type URL oppsett.

0

Del dette innlegget


Lenke til innlegg
Del på andre sider

Opprett en konto eller logg inn for å kommentere

Du må være et medlem for å kunne skrive en kommentar

Opprett konto

Det er enkelt å melde seg inn for å starte en ny konto!


Start en konto

Logg inn

Har du allerede en konto? Logg inn her.


Logg inn nå

  • Hvem er aktive   0 medlemmer

    Ingen innloggede medlemmer aktive