Ir para conteúdo
Fórum Script Brasil
  • 0

Alternate


Flasher

Pergunta

Olá amigos, estou montando um site em tableness...

Criei 5 folhas de estilo diferentes (site.css, site2.css, site3.css, site4.css e site5.css) e quero que ao clicar num botão a folha se altere....

No meu layout tem uma área onde tem 5 botões, são de uma mesma imagem, e estão dentro de uma layer....

NO HTML COLOQUEI ISSO:

<link rel="stylesheet" type="text/css" href="site.css" title="teste"/>

<link rel="alternate stylesheet" type="text/css" href="site2.css" title="teste2" />

<link rel="alternate stylesheet" type="text/css" href="site3.css" title="teste3" />

<link rel="alternate stylesheet" type="text/css" href="site4.css" title="teste4" />

<link rel="alternate stylesheet" type="text/css" href="site5.css" title="teste5" />

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

__________

<div id="botoes">

<map name="Map"><area shape="rect" coords="5,-1,19,11" href="onclick="setActiveStyleSheet('teste2');""></map>

</div>

a div botões é a div onde está a imagem cujo tem os botões que quero linkar....

______________________

Eu já criei o styleswitcher.js...

___________________________________

O problema é que mesmo com o <map> feito.... no layout não aparece nenhum link...ou seja, não acho o local para clicar e mudar....

Alguém pode me dizer o porque de não funcionar?

(vou colocar abaixo uma parte do código html e o código do js)

HTML

<head>

<meta http-equiv="pragma" content="no-cache" />

<meta name="description" content="/*orlanromano.com*/" />

<meta name="keywords" content="orlan romano, design, webdesign, portifolio" />

<meta name="robots" content="ALL" />

<meta name="rating" content="General" />

<meta name="author" content="Orlan Romano" />

<meta name="language" content="pt-br" />

<link rel="shortcut icon" href="/favicon.ico" />

<link rel="stylesheet" type="text/css" href="site.css" title="teste"/>

<link rel="alternate stylesheet" type="text/css" href="site2.css" title="teste2" />

<link rel="alternate stylesheet" type="text/css" href="site3.css" title="teste3" />

<link rel="alternate stylesheet" type="text/css" href="site4.css" title="teste4" />

<link rel="alternate stylesheet" type="text/css" href="site5.css" title="teste5" />

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

<title>/*orlanromano.com*/</title>

</head>

<body>

<div id="conteudo">

<div id="topo">

  <div id="logo"></div>

  <div id="botoes">

  <map name="Map">

  <area shape="rect" coords="5,-1,19,11" href="onclick="setActiveStyleSheet('teste2');""></map>

  </div>

 

JS

function setActiveStyleSheet(title) {

  var i, a, main;

  for(i=0; (a = document.getElementsByTagName("link")); i++) {

    if(a.getAttribute("rel").indexOf("style") != -1 && a.getAttribute("title")) {

      a.disabled = true;

      if(a.getAttribute("title") == title) a.disabled = false;

    }

  }

}

function getActiveStyleSheet() {

  var i, a;

  for(i=0; (a = document.getElementsByTagName("link")); i++) {

    if(a.getAttribute("rel").indexOf("style") != -1 && a.getAttribute("title") && !a.disabled) return a.getAttribute("title");

  }

  return null;

}

function getPreferredStyleSheet() {

  var i, a;

  for(i=0; (a = document.getElementsByTagName("link")); i++) {

    if(a.getAttribute("rel").indexOf("style") != -1

      && a.getAttribute("rel").indexOf("alt") == -1

      && a.getAttribute("title")

      ) return a.getAttribute("title");

  }

  return null;

}

function createCookie(name,value,days) {

  if (days) {

    var date = new Date();

    date.setTime(date.getTime()+(days*24*60*60*1000));

    var expires = "; expires="+date.toGMTString();

  }

  else expires = "";

  document.cookie = name+"="+value+expires+"; path=/";

}

function readCookie(name) {

  var nameEQ = name + "=";

  var ca = document.cookie.split(';');

  for(var i=0;i < ca.length;i++) {

    var c = ca;

    while (c.charAt(0)==' ') c = c.substring(1,c.length);

    if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length);

  }

  return null;

}

window.onload = function(e) {

  var cookie = readCookie("style");

  var title = cookie ? cookie : getPreferredStyleSheet();

  setActiveStyleSheet(title);

}

window.onunload = function(e) {

  var title = getActiveStyleSheet();

  createCookie("style", title, 365);

}

var cookie = readCookie("style");

var title = cookie ? cookie : getPreferredStyleSheet();

setActiveStyleSheet(title);

Link para o comentário
Compartilhar em outros sites

1 resposta a esta questão

Posts Recomendados

Participe da discussão

Você pode postar agora e se registrar depois. Se você já tem uma conta, acesse agora para postar com sua conta.

Visitante
Responder esta pergunta...

×   Você colou conteúdo com formatação.   Remover formatação

  Apenas 75 emoticons são permitidos.

×   Seu link foi incorporado automaticamente.   Exibir como um link em vez disso

×   Seu conteúdo anterior foi restaurado.   Limpar Editor

×   Você não pode colar imagens diretamente. Carregar ou inserir imagens do URL.



  • Estatísticas dos Fóruns

    • Tópicos
      152,1k
    • Posts
      651,8k
×
×
  • Criar Novo...