滚动到锚定在Prestashop（Jquery）

Question

please can you help me with small function - Im not skilled in JS / Jquery. 请您以小功能帮助我-我不精通JS / Jquery。 I need scroll to anchor in Prestashop, all codes are function only in index.php, not at another pages (product page, category page ..).. 我需要滚动到锚定在Prestashop中，所有代码仅在index.php中起作用，而在其他页面（产品页面，类别页面..）则不起作用。

So I need rule for this function be active only on index.php page ..but code bellow is not function:( 因此，我需要此函数的规则仅在index.php页面上有效。.但是以下代码不起作用：(

jQuery(function($) {
    var url = window.location.pathname;
    var string = "index.php";
    if(url.indexOf(string) !== -1) {  
       $("a.linkscroll").live('click',function(event){
          event.preventDefault();
          var target_offset = $(this.hash).offset() ? $(this.hash).offset().top : 0;       
          var customoffset = 120;
          $('html, body').animate({scrollTop:target_offset - customoffset}, 2000);
        });
    }   
    else {
       echo "nothing there?"
    }
    }(jQuery));

Please, can you help me? 拜托，你能帮我吗？ (in menu a links I have class a.linkscroll = a href="index.php#some-anchor", so I can use this = another anchors I dont need to be use) ..scroll function I have used only in main page (index.php), anchors have ID (for example a id="some-anchor"). （在菜单链接中，我有a.linkscroll = a href =“ index.php＃some-anchor”类，因此我可以使用此=我不需要使用的另一个锚）..scroll函数，我仅在main中使用过页面（index.php），锚点具有ID（例如，id =“ some-anchor”）。

Thank you for your help! 谢谢您的帮助！

Answer 1

Helllo Jiri 地狱吉里

In Prestashop, you can find page name and its associate controller in <body> id. 在Prestashop中，您可以在<body> id中找到页面名称及其关联控制器。

You can pass the $pagename from your controller file, by assigning it to smarty variable. 通过将$pagename分配给smarty变量，可以从其控制器文件中传递它。

The code to get a pagename is below: 获取页面名称的代码如下：

$pagename = Dispatcher::getInstance()->getController();

You can override your classes/controller/FrontController.php file and inside it find setMedia function. 您可以覆盖您的classes/controller/FrontController.php文件，并在其中找到setMedia函数。

There you can write your code to add JS for only home page. 在那里，您可以编写代码以仅在主页上添加JS。

$pagename = Dispatcher::getInstance()->getController();
if ($pagename  == 'index') {
$this->addJS(_THEME_JS_DIR_.'custom.js');
}

Add your JS in your theme JS folder and you will see your JS only in homepage. 将您的JS添加到主题JS文件夹中，您将仅在主页中看到JS。

If you can not find your JS loaded then remove cache/class_index.php file. 如果找不到加载的JS，则删除cache/class_index.php文件。

After it will be display. 之后将显示。

Answer 2

Probably the easiest way without any override is to target the index.php page from the tpl files. 可能没有任何替代的最简单方法是从tpl文件中定位index.php页面。

You can add it in any file, for example on the footer. 您可以将其添加到任何文件中，例如在页脚上。

So I'll start targeting the index.php page and it's as easy as. 因此，我将开始定位index.php页面，这很容易。

{if $page_name =='index'}
    <script type="text/javascript">
        $(document).ready(function() {
            $("a.linkscroll").on('click',function(event){
                event.preventDefault();
                var customoffset = 120;
                $('html, body').animate({
                    scrollTop: $($.attr(this, 'href')).offset().top - customoffset,
                }, 2000);
            });
        });
    </scrpt>
{/if}

You can see a live example here: JS Fiddle Example 您可以在此处看到一个实时示例： JS Fiddle示例

With that your code should work and only in the home page. 这样，您的代码应该只能在主页中工作。

滚动到锚定在Prestashop（Jquery）

问题描述

2 个解决方案

解决方案1
0 2018-01-07 04:08:35

解决方案2
0 2018-01-07 11:50:31

滚动到锚定在Prestashop（Jquery）

问题描述

2 个解决方案

解决方案1 0 2018-01-07 04:08:35

解决方案2 0 2018-01-07 11:50:31

解决方案1
0 2018-01-07 04:08:35

解决方案2
0 2018-01-07 11:50:31