Php 使用Drupal 7实现tabslideout

我正在尝试向我的Drupal7站点（主题）添加一个jquery插件tabslideout 我已经解释过很多次了，我用过Drupal7，但它在我的网站上不起作用。 我是一个绝对的新手，我不能让我的头脑围绕php，似乎我不能让功能工作

首先，我在.info文件中添加了脚本

接下来，我将以下代码添加到我的页面--front.tpl.php文件中：

<script type="text/javascript">
$(function(){
$('.slide-out-div').tabSlideOut({
    tabHandle: '.handle',                     //class of the element that will become your tab
    pathToTabImage: 'sites/all/themes/temp3/images/contact_tab.gif', //path to the image for the tab //Optionally can be set using css
    imageHeight: '122px',                     //height of tab image               //Optionally can be set using css
    imageWidth: '40px',                       //width of tab image            //Optionally can be set using css
    tabLocation: 'left',                      //side of screen where tab lives, top, right, bottom, or left
    speed: 300,                               //speed of animation
    action: 'click',                          //options: 'click' or 'hover', action to trigger animation
    topPos: '200px',                          //position from the top/ use if tabLocation is left or right
    leftPos: '20px',                          //position from left/ use if tabLocation is bottom or top
    fixedPosition: false                      //options: true makes it stick(fixed position) on scroll
});
});
</script>

只有div显示在页面上

我还发现了这段代码，不幸的是它不能正常工作

<script type="text/javascript">
(function($) {
Drupal.behaviors.tabslideout = {
    attach: function() {
$('.slide-out-div').tabSlideOut {
    tabHandle: '.handle',                     //class of the element that will become your tab
    pathToTabImage: 'sites/all/modules/tabslideout/images/contact_tab.gif', //path to the image for the tab //Optionally can be set using css
    imageHeight: '122px',                     //height of tab image           //Optionally can be set using css
    imageWidth: '40px',                       //width of tab image            //Optionally can be set using css
    tabLocation: 'left',                      //side of screen where tab lives, top, right, bottom, or left
    speed: 300,                               //speed of animation
    action: 'click',                          //options: 'click' or 'hover', action to trigger animation
    topPos: '200px',                          //position from the top/ use if tabLocation is left or right
    leftPos: '20px',                          //position from left/ use if tabLocation is bottom or top
    fixedPosition: true                     //options: true makes it stick(fixed position) on scroll
};.next().hide();
};
 };
  })(jQuery);

</script>

（函数（$）{
Drupal.behaviors.tabslideout={
附件：函数（）{
$（'.slide out div'）.tab滑出{
tabHandle:'.handle'，//将成为选项卡的元素的类
pathToTabImage:'sites/all/modules/tabslideout/images/contact_tab.gif'，//选项卡的图像路径//也可以使用css设置
imageHeight:'122px'，//选项卡图像的高度//也可以使用css设置
imageWidth:'40px'，//选项卡图像的宽度//可以选择使用css设置
tabLocation:'左'，//选项卡所在屏幕的一侧，顶部、右侧、底部或左侧
速度：300，//动画速度
操作：'单击'，//选项：'单击'或'悬停'，触发动画的操作
topPos:'200px'，//从顶部开始定位/如果tabLocation为左或右，则使用
leftPos:'20px'，//从左开始定位/如果tabLocation为底部或顶部，则使用
fixedPosition:true//选项：true使其在滚动上保持（固定位置）
}；.next（）.hide（）；
};
};
})（jQuery）；

我想一定有什么完全不同的东西我以前没想过，因为我根本不知道，这让一位专家大笑起来；） 同一页面包含“flexslider”元素

/////////////非常感谢您的评论/建议//////////////////////

尝试替换

<script type="text/javascript">
(function($) {
Drupal.behaviors.tabslideout = {
    attach: function() {
$('.slide-out-div').tabSlideOut {
tabHandle: '.handle',                     //class of the element that will become your tab
pathToTabImage: 'sites/all/modules/tabslideout/images/contact_tab.gif', //path to the image for the tab //Optionally can be set using css
imageHeight: '122px',                     //height of tab image           //Optionally can be set using css
imageWidth: '40px',                       //width of tab image            //Optionally can be set using css
tabLocation: 'left',                      //side of screen where tab lives, top, right, bottom, or left
speed: 300,                               //speed of animation
action: 'click',                          //options: 'click' or 'hover', action to trigger animation
topPos: '200px',                          //position from the top/ use if tabLocation is left or right
leftPos: '20px',                          //position from left/ use if tabLocation is bottom or top
fixedPosition: true                     //options: true makes it stick(fixed position) on scroll
};.next().hide();
};
};
  })(jQuery);

</script>

（函数（$）{
Drupal.behaviors.tabslideout={
附件：函数（）{
$（'.slide out div'）.tab滑出{
tabHandle:'.handle'，//将成为选项卡的元素的类
pathToTabImage:'sites/all/modules/tabslideout/images/contact_tab.gif'，//选项卡的图像路径//也可以使用css设置
imageHeight:'122px'，//选项卡图像的高度//也可以使用css设置
imageWidth:'40px'，//选项卡图像的宽度//可以选择使用css设置
tabLocation:'左'，//选项卡所在屏幕的一侧，顶部、右侧、底部或左侧
速度：300，//动画速度
操作：'单击'，//选项：'单击'或'悬停'，触发动画的操作
topPos:'200px'，//从顶部开始定位/如果tabLocation为左或右，则使用
leftPos:'20px'，//从左开始定位/如果tabLocation为底部或顶部，则使用
fixedPosition:true//选项：true使其在滚动上保持（固定位置）
}；.next（）.hide（）；
};
};
})（jQuery）；

与

$（函数（）{
$（'.slide out div'）.tab滑出{
tabHandle:'.handle'，//将成为选项卡的元素的类
pathToTabImage:'sites/all/modules/tabslideout/images/contact_tab.gif'，//选项卡的图像路径//也可以使用css设置
imageHeight:'122px'，//选项卡图像的高度//也可以使用css设置
imageWidth:'40px'，//选项卡图像的宽度//可以选择使用css设置
tabLocation:'左'，//选项卡所在屏幕的一侧，顶部、右侧、底部或左侧
速度：300，//动画速度
操作：'单击'，//选项：'单击'或'悬停'，触发动画的操作
topPos:'200px'，//从顶部开始定位/如果tabLocation为左或右，则使用
leftPos:'20px'，//从左开始定位/如果tabLocation为底部或顶部，则使用
fixedPosition:true//选项：true使其在滚动上保持（固定位置）
};
};

正如网站所描述的那样

如果这不起作用，请尝试删除 .next（）.hide（）

---

干杯。

大家好-非常感谢-我尝试了这两种方法，但不幸的是都不起作用。我不知道为什么，但它只加载div中的文本，没有js…您知道函数的代码如何直接从page.tpl.php…中加载jquery脚本吗。。。？

<script type="text/javascript">
(function($) {
Drupal.behaviors.tabslideout = {
    attach: function() {
$('.slide-out-div').tabSlideOut {
    tabHandle: '.handle',                     //class of the element that will become your tab
    pathToTabImage: 'sites/all/modules/tabslideout/images/contact_tab.gif', //path to the image for the tab //Optionally can be set using css
    imageHeight: '122px',                     //height of tab image           //Optionally can be set using css
    imageWidth: '40px',                       //width of tab image            //Optionally can be set using css
    tabLocation: 'left',                      //side of screen where tab lives, top, right, bottom, or left
    speed: 300,                               //speed of animation
    action: 'click',                          //options: 'click' or 'hover', action to trigger animation
    topPos: '200px',                          //position from the top/ use if tabLocation is left or right
    leftPos: '20px',                          //position from left/ use if tabLocation is bottom or top
    fixedPosition: true                     //options: true makes it stick(fixed position) on scroll
};.next().hide();
};
 };
  })(jQuery);

</script>

<script type="text/javascript">
(function($) {
Drupal.behaviors.tabslideout = {
    attach: function() {
$('.slide-out-div').tabSlideOut {
tabHandle: '.handle',                     //class of the element that will become your tab
pathToTabImage: 'sites/all/modules/tabslideout/images/contact_tab.gif', //path to the image for the tab //Optionally can be set using css
imageHeight: '122px',                     //height of tab image           //Optionally can be set using css
imageWidth: '40px',                       //width of tab image            //Optionally can be set using css
tabLocation: 'left',                      //side of screen where tab lives, top, right, bottom, or left
speed: 300,                               //speed of animation
action: 'click',                          //options: 'click' or 'hover', action to trigger animation
topPos: '200px',                          //position from the top/ use if tabLocation is left or right
leftPos: '20px',                          //position from left/ use if tabLocation is bottom or top
fixedPosition: true                     //options: true makes it stick(fixed position) on scroll
};.next().hide();
};
};
  })(jQuery);

</script>

<script type="text/javascript">
$(function(){
$('.slide-out-div').tabSlideOut {
    tabHandle: '.handle',                     //class of the element that will become your tab
    pathToTabImage: 'sites/all/modules/tabslideout/images/contact_tab.gif', //path to the image for the tab //Optionally can be set using css
    imageHeight: '122px',                     //height of tab image           //Optionally can be set using css
    imageWidth: '40px',                       //width of tab image            //Optionally can be set using css
    tabLocation: 'left',                      //side of screen where tab lives, top, right, bottom, or left
    speed: 300,                               //speed of animation
    action: 'click',                          //options: 'click' or 'hover', action to trigger animation
    topPos: '200px',                          //position from the top/ use if tabLocation is left or right
    leftPos: '20px',                          //position from left/ use if tabLocation is bottom or top
    fixedPosition: true                     //options: true makes it stick(fixed position) on scroll
};
};

</script>