/ Forside/ Teknologi / Udvikling / HTML / Spørgsmål
Login
Glemt dit kodeord?
Brugernavn

Kodeord


Reklame
Top 10 brugere
HTML
#NavnPoint
molokyle 11184
Klaudi 5506
bentjuul 3377
severino 2040
smorch 1950
strarup 1525
natmaden 1396
scootergr.. 1320
e.c 1150
10  miritdk 1110
Ændre stylesheet på hjemmeside!
Fra : mpjc
Vist : 543 gange
50 point
Dato : 18-08-05 19:06

Hej!

Er det muligt at lave en funktion på hjemmeside så brugerne kan ændre sidens stylesheet. ( jeg har flere stylesheet ).

Håber på hjælp.


 
 
Kommentar
Fra : molokyle


Dato : 18-08-05 19:28
Kommentar
Fra : mpjc


Dato : 19-08-05 15:26

Hhhm, jeg har prøvet dinne forslag...

Er det ikke muligt at lave det med en rullemenu?

Kommentar
Fra : mpjc


Dato : 19-08-05 15:29

Hvis du forstår? Ellers bare sig til...

Kommentar
Fra : molokyle


Dato : 19-08-05 16:09

Joeh da... Da tilføjer du bare scriptet i din : <form> ... </form> ; http://www.w3schools.com/tags/tag_form.asp

..på event'en : onclick

..eller attribut'en : action

På denne side har jeg lavet dette med en <button> ... </button> markør : http://birgitteschultz.frac.dk/

Se under menu'en : [Mine billeder] ..hvor du dynamisk kan vælge baggrundsfarver

</MOLOKYLE>

Kommentar
Fra : mpjc


Dato : 19-08-05 17:30

Nej ikke som under Mine billeder noget mere i stil med dette... www.mpjc.dk/box.html

Kommentar
Fra : molokyle


Dato : 19-08-05 21:02

Jeg har da svaret dig

Citat
Er det muligt at lave en funktion på hjemmeside så brugerne kan ændre sidens stylesheet. ( jeg har flere stylesheet ).


..og nu vil du undervises i FORM's

Hvordan kalder jeg et javascript udfra et valg i en dropdown menu :

<form> <select> <option> ... </option> </select> </form> ???

..det ved jeg faktisk ikke

Nyt spørgsmål

</MOLOKYLE>

Kommentar
Fra : miritdk


Dato : 19-08-05 21:22
Kommentar
Fra : molokyle


Dato : 19-08-05 21:36

Virker perfekt miritdk. Tak for linket , men bruger udover selectboxen stadig knapper og det ville mpjc så vidt jeg forstod ikke ha'

</MOLOKYLE>

Kommentar
Fra : miritdk


Dato : 19-08-05 21:40

forstår nu heller ikke helt spørgsmålet - og der er altså rullemenu på linket

Accepteret svar
Fra : molokyle

Modtaget 50 point
Dato : 19-08-05 21:51

Jeg lod mig lige inspirere og skrev denne alternative løsning i CSS :

Kode
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script type="text/javascript">
<!--
if(!document.getElementById)
alert("Du bruger en ældre browser, der ikke tillader brugervalgte stylesheets.")
else if(document.cookie.indexOf('style=1')>=0){
document.write('<link rel="stylesheet" type="text/css" href="style_1.css" media="screen">\n');
}
else if (document.cookie.indexOf('style=2')>=0) {
document.write('<link rel="stylesheet" type="text/css" href="style_2.css" media="screen">\n');
}
else if (document.cookie.indexOf('style=3')>=0) {
document.write('<link rel="stylesheet" type="text/css" href="style_3.css" media="screen">\n');
}
else if (document.cookie.indexOf('style=4')>=0) {
document.write('<link rel="stylesheet" type="text/css" href="layout.css" media="screen">\n');
}
else {
document.write('<link rel="stylesheet" type="text/css" href="layout.css" media="screen">\n');
}

function chooseStyle (newstyle){
if (!document.getElementById){
alert("Du bruger en ældre browser, der ikke tillader brugervalgte stylesheets.");
return false;
}
var expdate = new Date();
expdate.setTime(expdate.getTime() + (1000*3600*24*365));
document.cookie = 'style=' + newstyle + 'expires=' + expdate.toGMTString() + 'path=/';
self.location.reload();
}
//-->
</script>
<style type="text/css">
<!--
p.csslist {
   
   background-color: #cfd5ff;
   width: 96px; height: 16px;
   border : thin solid black;
   overflow : auto;
   SCROLLBAR-FACE-COLOR: #aad988;
SCROLLBAR-HIGHLIGHT-COLOR: #aad988;
SCROLLBAR-SHADOW-COLOR: #80000f;
SCROLLBAR-3DLIGHT-COLOR: #80000f;
SCROLLBAR-ARROW-COLOR: #8000f;
SCROLLBAR-TRACK-COLOR: #aad9ff;
SCROLLBAR-DARKSHADOW-COLOR: #aad988;
SCROLLBAR-BASE-COLOR: #aad988;
   font-family: Verdana, Arial;
   font-size: 12px;
}
-->
</style>
<title>Untitled Document</title>
</head>
<body>
<p class="csslist">
<span onclick="chooseStyle(1);">Style 1</span>
<br>
<span onclick="chooseStyle(2);">Style 2</span>
<br>
<span onclick="chooseStyle(3);">Style 3</span>
<br>
</p>
</body>


</MOLOKYLE>

Kommentar
Fra : miritdk


Dato : 19-08-05 21:54

det hele står jo i vis kilde

Godkendelse af svar
Fra : mpjc


Dato : 20-08-05 12:12

Tak for svaret molokyle.
         
Det var jo lige det jeg skulle bruge....            

Kommentar
Fra : molokyle


Dato : 20-08-05 14:59

Velbekomme , men så husk der nogle 'flaws' i min nævnte kode:

ad. 1) Jeg har jo i javascriptet henvist til 3 + 1 stylesheets, så derfor burder jeg have tilføjet :

Kode
<span onclick="chooseStyle(4);">Style 4</span>
<br>


..nederst i 'boxen' mellem <p..> ... </p> markøren

ad. 2) ..og farverne i CSS egenskaberne for klassen p.csslist burde ikke være så 'vingeskudte' (..jeg snuppede lige noget jeg havde liggende i forvejen )

ad.3) Man bør lægge scriptet i en extern *.js fil f.eks. layout.js og inkludere den på alle sine sider i <head> ... </head> sektionen med markøren :

Kode
<script type="text/javascript" src="layout.js"></script>


Jeg håber du selv kan rette til? ...ellers må du spørge

</MOLOKYLE>

Du har følgende muligheder
Eftersom du ikke er logget ind i systemet, kan du ikke skrive et indlæg til dette spørgsmål.

Hvis du ikke allerede er registreret, kan du gratis blive medlem, ved at trykke på "Bliv medlem" ude i menuen.
Søg
Reklame
Statistik
Spørgsmål : 177558
Tips : 31968
Nyheder : 719565
Indlæg : 6408914
Brugere : 218888

Månedens bedste
Årets bedste
Sidste års bedste