Joomla / Php / Jquery / Css中的Switchstyle问题

时间:2009-08-24 04:37:06

标签: php jquery css joomla styleswitching

我一直在开发一个网站(现在这里是一个例子:http://neurotoxine.mine.nu/gloom),我从样式代理代码中得到了一个奇怪的行为。它很大所以请耐心等待。

首先,你可以先去我指定的网站看看。 你有什么,这是一个joomla页面,使用Jquery

var $j = jQuery.noConflict();

为了避免mootools冲突。 然后,我使用了这些:

<?  // Checks for, and assigns cookie to local variable:
if(isset($_COOKIE['style']))
{   $style = $_COOKIE['style'];
}
// If no cookie is present then set style as "red" (default):
else {    $style = 'red';
}
?>

这仅适用于cookie设置,如果未设置cookie,则$ style = red,并且此变量将附加到CSS。像这样:

<link rel="stylesheet" type="text/css" href="<?php echo $this->baseurl ?>/templates/wh1/css/template_<?php echo $style ?>.css" media="screen" />

第一个代码,$ this-&gt; baseurl = joomla安装的目录,在这种情况下是幽暗。 第二个,echo $ style,将写入cookie加载的值或从选项中分配的值,如果你第一次到达那里然后你将获得RED作为值,template_red.css将是CSS的整个网站。

有一个JS,可以做一些jquery技巧:

 jQuery.fn.styleSwitcher = function(){
  $j(this).click(function(){
      // We're passing this element object through to the loadStyleSheet function.
      loadStyleSheet(this);
      // And then we're returning false.
      return false;
  });
  function loadStyleSheet(obj) {
    $j('#preloader')
    // Now fade in the div (#preloader):
    .fadeIn(500,function(){
      // The following will happen when the div has finished fading in:
      // Request PHP script (obj.href) with appended "js" query string item:
      $j.get( obj.href+'&js',function(data){
        // Select link element in HEAD of document (#stylesheet) and change href attribute:
        $j('#stylesheet').attr('href','css/' + data + '.css');
        // Check if new CSS StyleSheet has loaded:
        cssDummy.check(function(){
          // When StyleSheet has loaded, fade out and remove the #overlay div:
          $j('#preloader').fadeOut(500);
        });
      });
    });
  }
  // CSS DUMMY SECTION
  var cssDummy = {
    init: function(){
      // Appends "dummy-element" div to body:
      $j('<div id="dummy-element" style="display:none" />').appendTo('body');
    },
    check: function(callback) {
      // Checks if computed width equals that which is defined in the StyleSheets (2px):
      if ($j('#dummy-element').width()==2) callback();
      // If it has not loaded yet then simple re-initiate this function every 200 milliseconds until it had loaded:
      else setTimeout(function(){cssDummy.check(callback)}, 200);
    }
  }
  cssDummy.init(); }

然后,我在我的页面中启动该功能:

$j(document).ready(function(){
$j('#style-switcher a').styleSwitcher();
});

我从这样的链接中调用它:

<a href="<?php echo $this->baseurl ?>/templates/wh1/style-switcher.php?style=fire">img</a>

最后,styleswitcher.php代码在这里:

<?php
$style = $_GET['style'];
setcookie("style", $style, time()+604800*24); // 604800 = amount of seconds in one week *4=1 month *24=1/2 year *48=1 year
if(isset($_GET['js']))
echo $style;
else header("Location: ".$_SERVER["HTTP_REFERER"]); ?>

现在,问题在于,当我在网站上测试时,一切正常(http://neurotoxine.mine.nu/wht/index-test.php - 样式广告的顶部和左侧的链接显示为THEMES)。但是当我在joomla模板中插入整个代码时,整个系统都失败了。我在这里和那里做了一些修复(主要是$ j声明)然后我意识到这可能是与模板路径有关的东西,所以我测试了许多类型的声明,绝对路径,相对路径等等,没有任何反应。

然后我将styleswitcher.php复制到joomla(neurotoxine.mine.nu/gloom)的根目录并检查ti是否可以在那里工作,我得到一个空白页面。我点击了回去然后哇哇哇哇哇哇哇哇哇哇哇哇哇哇哇哇哇哇哇哇哇哇哇哇哇哇哇哇哇哇哇哇哇哇哇哇哇哇哇哇哇哇哇哇哇哇哇哇哇哇哇哇指导,但我不知道该改变什么来使其发挥作用。

Joomla在标题中为其模板提供了声明:

<base href="http://neurotoxine.mine.nu/gloom/" />

我不知道这是否对http_referer的工作方式做了什么,但是我禁用了这个并且网站仍然是这样做的,点击一个样式,页面空白,点击返回和瞧,样式已经改变但无法检索我所在的页面。

一些想法?任何帮助都可能有用。

2 个答案:

答案 0 :(得分:1)

仅当您点击链接时(而不是直接在地址栏中输入),才会设置Referer。事实上,浏览器在点击此链接之前会告诉用户网站的位置,因此您无法将其信任为100%(请参阅PHP Manual)。我会将最后访问过的页面存储在$ _SESSION中并重定向到此页面;如果它是空的,重定向到$ this-&gt; baseurl。 '的index.php'。

只有相对链接需要base-Tag,例如

<a href="index.php">

甚至:

<a>

另一个提示:在从cookie中获取样式之前,请检查它是否存在(硬编码所有可用模板或file_exists())。如果没有,请采用默认值(红色)。

答案 1 :(得分:0)

我解决了这个问题......解决方案正在解决三到四个错误:

首先,html中的cookie检查器应该询问coockie是否为空,如果是SET则为no。所以:

<?php  // Checks for, and assigns cookie to local variable:
if(!empty($_COOKIE['style'])) $style = $_COOKIE['style'];
// If no cookie is present then set style as "red" (default):
else $style = 'red';
?>

这是第一件要解决的问题。 然后这一行被修复,因为JQuery插件要求改变标题中的ID。我没有意识到链接样式表声明中没有ID

<link id="stylesheet" rel="stylesheet" type="text/css" href="<?php echo $this->baseurl ?>/templates/wh1/css/template_<?php echo $style ?>.css" media="screen" />

在这一行中我也发现了

<?php echo $this->baseurl ?>

应该替换为基地址,但是没有域名,所以它应该是

/gloom/templates/wh1/css/template_<?php echo $style ?>.css

此外,在JQuery插件的初始化中,我犯了一个致命的错误。我没有更改插件将要捕获的标记容器的ID。这部分是由于样式表标题上的ID与标记容器上的ID之间的混淆。所以我用“#tselect”作为DIV的ID,它解决了Jquery的工作。此外,在插件的每个语句中都必须使用ad $ j。

$j(document).ready(function(){
    $j.preloadCssImages({statusTextEl: '#textStatus', statusBarEl: '#status'});
        $j("img#hhead").toggle(
        function () { 
            $j("#headtop").slideDown();
        },
        function () {
            $j("#headtop").slideUp();
        });
    $j("#tselect a").styleSwitcher(); // here is the "ID TAG".plugin() call.
});

现在,在styleswitcher.php中,我使用了一个有人告诉我关于cookie的提示:

<?php $style = $_GET['style'];
setcookie("style", $style, time()+604800,"/"); // 604800 = amount of seconds in one week
if(isset($_GET['js'])) echo $style;
else header("Location: ".$_SERVER['HTTP_REFERER']);
?>
你注意到了吗?是一个简单/斜线。

现在一切正常。 stylechanger改变了样式和JQuery效果。 你可以在这里看到它:link text

如果有人想要这些文件和解释,请给我发消息。