login  Naam:   Wachtwoord: 
Registreer je!
 Forum

style veranderen

Offline Luke538 - 21/05/2005 00:48
Avatar van Luke538Nieuw lid heeft iemand een script waarmee de bezoeker van me site de kleuren style van me site kan veranderen ? en dat die dat onthoud tot diegene de volgende x op me site komt ?
Alvast bedankt

13 antwoorden

Gesponsorde links
Offline Futs - 21/05/2005 00:59 (laatste wijziging 21/05/2005 01:00)
Avatar van Futs Nieuw lid In je HTML:
php code - Bekijk de code zonder highlighting - Klap code in 
  1. <script type="text/javascript" src="switch.js"></script>
  2. <link rel="alternate" type="text/css" href="stijl1.css" title="blabla" />
  3. <link rel="alternate" type="text/css" href="stijl2.css" title="bladiebla" />
  4.  
  5. <a href="#" onclick="setActiveStyleSheet('blabla'); return false;">blabla</a>
  6. <a href="#" onclick="setActiveStyleSheet('bladiebla'); return false;">bladiebla</a>

En je kan zoveel stylesheets toevoegen als je wilt.

switch.js
php code - Bekijk de code zonder highlighting - Klap code in 
  1. function setActiveStyleSheet(title) {
  2.   var i, a, main;
  3.   for(i=0; (a = document.getElementsByTagName("link")[i]); i++) {
  4.     if(a.getAttribute("rel").indexOf("style") != -1 && a.getAttribute("title")) {
  5.       a.disabled = true;
  6.       if(a.getAttribute("title") == title) a.disabled = false;
  7.     }
  8.   }
  9. }
  10.  
  11. function getActiveStyleSheet() {
  12.   var i, a;
  13.   for(i=0; (a = document.getElementsByTagName("link")[i]); i++) {
  14.     if(a.getAttribute("rel").indexOf("style") != -1 && a.getAttribute("title") && !a.disabled) return a.getAttribute("title");
  15.   }
  16.   return null;
  17. }
  18.  
  19. function getPreferredStyleSheet() {
  20.   var i, a;
  21.   for(i=0; (a = document.getElementsByTagName("link")[i]); i++) {
  22.     if(a.getAttribute("rel").indexOf("style") != -1
  23.        && a.getAttribute("rel").indexOf("alt") == -1
  24.        && a.getAttribute("title")
  25.        ) return a.getAttribute("title");
  26.   }
  27.   return null;
  28. }
  29.  
  30. function createCookie(name,value,days) {
  31.   if (days) {
  32.     var date = new Date();
  33.     date.setTime(date.getTime()+(days*24*60*60*1000));
  34.     var expires = "; expires="+date.toGMTString();
  35.   }
  36.   else expires = "";
  37.   document.cookie = name+"="+value+expires+"; path=/";
  38. }
  39.  
  40. function readCookie(name) {
  41.   var nameEQ = name + "=";
  42.   var ca = document.cookie.split(';');
  43.   for(var i=0;i < ca.length;i++) {
  44.     var c = ca[i];
  45.     while (c.charAt(0)==' ') c = c.substring(1,c.length);
  46.     if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length);
  47.   }
  48.   return null;
  49. }
  50.  
  51. window.onload = function(e) {
  52.   var cookie = readCookie("style");
  53.   var title = cookie ? cookie : getPreferredStyleSheet();
  54.   setActiveStyleSheet(title);
  55. }
  56.  
  57. window.onunload = function(e) {
  58.   var title = getActiveStyleSheet();
  59.   createCookie("style", title, 365);
  60. }
  61.  
  62. var cookie = readCookie("style");
  63. var title = cookie ? cookie : getPreferredStyleSheet();
  64. setActiveStyleSheet(title);


ps: er staat er ook 1 bij de scripts/tuts hier op sitemasters.
Offline zointer - 21/05/2005 06:34 (laatste wijziging 21/05/2005 06:36)
Avatar van zointer HTML gevorderde
php code - Bekijk de code zonder highlighting - Klap code in 
  1. <?
  2. if($_COOKIE[thema] == "oogverblindendroze"){
  3. $page_header = "Wat een rose kleur!!!";
  4. $page_footer = "Jah rose! =)";
  5. }
  6. elseif($_COOKIE[thema] == "pimpelpaars"){
  7. $page_header = "Aha";
  8. $page_footer = "Hmmmz...";
  9. }
  10. else{
  11. $page_header = "Standaard";
  12. $page_footer = "O";
  13. }
  14. ?>

spreek je aan met dit Menu vb dropdown
php code - Bekijk de code zonder highlighting - Klap code in 
  1. <form method="POST" action="dinkie">
  2.   <select size="1" name="thema">
  3.   <option>oogverblindendroze</option>
  4.   <option>pimpelpaars</option>
  5.   </select>
  6.   <input type="submit" value="huppakee!" name="submitje">
  7. </form>


nog een style.inc.php
php code - Bekijk de code zonder highlighting - Klap code in 
  1. <?php
  2.  
  3. /**** STYLE ****/
  4.  
  5. $default_style = "1"; // hier kun je de style kiezen als hij niet gekozen word door de gast
  6.  
  7. $styles['1']['name'] = "Naam hier"; // naam
  8. $styles['1']['bg'] = "Hexcode"; // achtergrond kleur
  9.  
  10. $styles['2']['name'] = "Naam hier"; // naam
  11. $styles['2']['bg'] = "Hexcode"; // achtergrond kleur
  12.  
  13.  
  14. /*
  15. Je kunt dus ook meerdere variabeles aan maken.. Dus bijvoorbeeld je css bestand met $styles['3']['css'] = "url hier";
  16. Als je dit doet voeg em dan WEL toe aan het onderste, kijk maar naar de anderen.. als je dit niet doet zal het niet werken
  17. */
  18.  
  19.  
  20.  
  21.  
  22. if(isset($set_style)) {
  23.  
  24.     setcookie("style", $set_style);
  25.     echo "<script type=\"text/javascript\">\ntop.location.href = 'index.php'\n</script>";
  26.  
  27.  
  28. } else {
  29.  
  30.     $style = $HTTP_COOKIE_VARS["style"];
  31.     if($style == "") {
  32.         $style_naam = $styles[$default_style]['name'];
  33.         $style_bg = $styles[$default_style]['bg'];
  34.         $style_img = $styles[$default_style]['img'];
  35.  
  36.     } elseif($styles[$style]['name'] != "") {
  37.         $style_naam = $styles[$style]['name'];
  38.         $style_bg = $styles[$style]['bg'];
  39.         $style_img = $styles[$style]['img'];
  40.  
  41.     } else {
  42.         $style_naam = $styles[$default_style]['name'];
  43.         $style_bg = $styles[$default_style]['bg'];
  44.         $style_img = $styles[$default_style]['img'];
  45.     }
  46. }
  47.  
  48. ?>
index.php
php code - Bekijk de code zonder highlighting - Klap code in 
  1. <?php
  2. include("./style.inc.php");
  3. ?>
  4.  
  5. <html>
  6.  
  7. <head>
  8. <meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
  9. <title>Titel</title>
  10. </head>
  11.  
  12. <body bgcolor="<?php echo $style_bg; ?>">
  13.  
  14. Selecteer style: <a href="index.php?set_style=1">Style1</a>,
  15. <a href="index.php?set_style=2">Style2</a>
  16.  
  17. </body>
  18. </html>

hier nog eentje thema.php
php code - Bekijk de code zonder highlighting - Klap code in 
  1. <?
  2.  
  3. if ($submit)
  4.     {
  5.     $tijd = time()+31536000;
  6.     setcookie("thema", $kleur, $tijd);
  7.     header("Location: $HTTP_REFERER");   
  8.     }
  9. else
  10.     {
  11.     if($_COOKIE[thema] == "")
  12.         {
  13.         $achtergrond = "#FFFFFF";
  14.         $tekst = "#000000";
  15.         }
  16.     elseif($_COOKIE[thema] == rood)
  17.         {
  18.         $achtergrond = "#990000";
  19.         $tekst = "#FFFFFF";
  20.         }
  21.     elseif($_COOKIE[thema] == blauw)
  22.         {
  23.         $achtergrond = "#0066CC";
  24.         $tekst = "#FFFFFF";
  25.         }
  26.     elseif($_COOKIE[thema] == groen)
  27.         {
  28.         $achtergrond = "#00FF00";
  29.         $tekst = "#FFFFFF";
  30.         }
  31.     }     
  32.  
  33. ?>

index.php
php code - Bekijk de code zonder highlighting - Klap code in 
  1. <?
  2.  
  3. include ('thema.php');
  4.  
  5. ?>
  6.  
  7. <html>
  8.  
  9. <body bgcolor="<?=$achtergrond ?>">
  10. <font color="<?=$tekst ?>" size="7">Thema systeem</font>
  11. <br>
  12. <form method="post" action="thema.php">
  13.   <select name="kleur">
  14.     <option value="rood" selected>rood</option>
  15.     <option value="blauw">blauw</option>
  16.     <option value="groen">groen</option>
  17.   </select>
  18.   <input name="submit" type="submit" value="Kies">
  19. </form>
  20. </body>
  21. </html>
Offline Luke538 - 29/05/2005 11:16
Avatar van Luke538 Nieuw lid okej thx
Offline Futs - 29/05/2005 11:25
Avatar van Futs Nieuw lid heb je winterslaap gehouden?
Offline Luke538 - 29/05/2005 11:47 (laatste wijziging 29/05/2005 12:00)
Avatar van Luke538 Nieuw lid jah 

ps: futs die van jou werk niej bij mij 
en waar stond er ok 1 bij scripts ?
Offline flyingdragon - 29/05/2005 12:06
Avatar van flyingdragon PHP beginner Hier http://www.site...amp;id=678
Offline Fenrir - 29/05/2005 12:49
Avatar van Fenrir PHP expert Dit gebruik ik:
http://www.alistapart.com/articles/bodyswitchers/
Offline Luke538 - 29/05/2005 15:33 (laatste wijziging 30/05/2005 14:39)
Avatar van Luke538 Nieuw lid thx ik heb die gebruikt die flyingdragon stuurde werkt perfeckt 

Aleen nog 1 vraag:
Kan ja als je style veranderd ok een plaatje mee laten veranderen. dus dat ik per style een ander plaatje heb?
Offline Fenrir - 30/05/2005 17:36
Avatar van Fenrir PHP expert Ja, dan zet je in je css een achtergrond plaatje:

#header
{
background: url('images/plaatje1.png');
}

#style2 #header
{
background: url('images/plaatje2.png');
}
Offline prorsoft - 30/05/2005 17:39 (laatste wijziging 30/05/2005 17:40)
Avatar van prorsoft PHP gevorderde ik denk het wel!
als je met css het zo doet:
php code - Bekijk de code zonder highlighting - Klap code in 
  1. <style>
  2. td#plaatje { background-image: url(plaatje1.jpg); }
  3. </style>
  4. <table><tr><td id="plaatje" /></tr></table>
  5. <a href="javascript:plaatje.style.backgroundimage='url(plaatje2.jpg)'">Verander plaatje</a>



EDIT: te laat...
Offline Luke538 - 30/05/2005 18:26
Avatar van Luke538 Nieuw lid ik heb dat script geprobeerd aleen nu heb ik een knop om het plaatje te veranderen. maar ik wil graag als ik style1.css gebruik een rood logo hebben (roodlogo.jpg) en als ik style2.css gebruik dat op die plek dan een blauw logo staat (blauwlogo.jpg)
zou dat op deze manier ok kunne ?
Offline nemesiskoen - 30/05/2005 18:48
Avatar van nemesiskoen Gouden medaille

PHP expert		 ja...

bekijk de code en probeer het zelf te implementeren?
waarom probeer je niet eerst? of verwacht je dat wij jou website volledig in elkaar gaan steken?
Offline Luke538 - 31/05/2005 10:05
Avatar van Luke538 Nieuw lid nee...

maar ik snap niet hoe ik een plaatje via een css file kan krijgen. Dat is het enige dat ik niet weet.
Gesponsorde links
Dit onderwerp is gesloten.
Actieve forumberichten
© 2002-2024 Sitemasters.be - Regels - Laadtijd: 0.347s