NivoSlider在magento上运行不顺畅 [英] NivoSlider not working smoothly on magento

问题描述

我正在尝试在我的magento安装上实施。

在Prototype上使用反向函数已经与NivoSlider发生冲突。 github上的人发现了这个问题，并给出了一个快速解决方案：
https：// github.com/gilbitron/Nivo-Slider/issues/35

这个问题让我抓狂，因为到处都没有足够的资源（试试谷歌吧）你不会找到这个问题的直接答案。所以我希望我的问题，以及我自己的答案可以帮助其他人与我同样的情况：）

I'm trying to implement nivoslider on my magento installation. I just copy paste what's in the downloaded demo package (which I've tested out on my firefox and run very smooth) to the magento. I did all the homework

• copy all the required js and css files to my theme's skin folder

• add those files on page.xml

  <reference name="head">
    <action method="addCss"><stylesheet>css/styles.css</stylesheet></action>
    ...
    <action method="addCss"><stylesheet>css/nivo-slider.css</stylesheet></action>
    <action method="addCss"><stylesheet>css/themes/default/default.css</stylesheet></action>
    <action method="addCss"><stylesheet>css/themes/default/pascal.css</stylesheet></action>
    <action method="addCss"><stylesheet>css/themes/default/orman.css</stylesheet></action>
    <action method="addItem"><type>skin_js</type><name>js/jquery-1.6.2-no-conflict.js</name><params/></action>
    ...
    <action method="addItem"><type>skin_js</type><name>js/jquery.nivo.slider.pack.js</name><params/></action>
    <action method="addItem"><type>skin_js</type><name>js/my_own_custom_script.js</name><params/></action>
    ...
  </reference>
  

• copy the slider html section on magento cms page

• and finally add jQuery(document).ready(function($) { $('#slider').nivoSlider(); }); to my_own-custom_script.js

It runs, but not smoothly. Sometimes the slide just paused for a while. The other times, one of the image slide won't showed up. The animation is also a little bit flickering. The slider navigation (the prev-next button and those circle on the bottom of the slider) sometimes get unresponsive on my click event. What makes me confused is, all those symptoms just happen sometimes, some other time it runs well.

oh, one more thing, this nivoslider also always make my firefox crash everytime I inspect one of its element with firebug.

Could anyone give me some clue, why is this happening? I suspect this has something to do with the conflict with magento's Prototype script (although it all already runs in noconflict mode)

解决方案

after some digging, I found the solution... and the solution is very simple: as simple as adding one little underscore character to nivoslider script. just replace this line on nivoslider script:

$.fn._reverse = [].reverse;

to this

$.fn._reverse = []._reverse;

And here is the explanation for those who need explanation:

if you see the error listing (with firefox, ctrl+shift+j) while using nivoslider, you will see that the prototype got too much recursion. This is the explanation of that "too much recursion" of Prototype: prototype too much recursion problem.

Usage of reverse function on Prototype has made conflict with NivoSlider. guys on github found this problem and give one quick solution here: https://github.com/gilbitron/Nivo-Slider/issues/35

this problem has drive me crazy, for there are no sufficient resource everywhere (try google it out and you'll find no direct answer to this problem). So I hope my question, along with my own answer could help other people out there with the same case with me :)

这篇关于NivoSlider在magento上运行不顺畅的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！