Note that there are some explanatory texts on larger screens.

plurals
  1. POMootools and YUI Carousel Issue
    text
    copied!<p>I am working on a site which uses Mootools and a carousel has been added to the site which is taken from here - <a href="http://developer.yahoo.com/yui/examples/carousel/carousel-ariaplugin_source.html">http://developer.yahoo.com/yui/examples/carousel/carousel-ariaplugin_source.html</a></p> <p>The problem is that the carousel somehow doesn't play nice with Mootools. With Mootools, it doesn't work and when I remove Mootools, it starts working. Firebug also doesn't show any JS errors or conflicts in console when Mootools is enabled.</p> <p>I have setup couple of jsfiddles to demonstrate the issue.</p> <ul> <li><a href="http://jsfiddle.net/jnED8/1/">http://jsfiddle.net/jnED8/1/</a> (with mootools - DOES NOT WORK)</li> <li><a href="http://jsfiddle.net/jnED8/">http://jsfiddle.net/jnED8/</a> (without mootools - WORKS FINE)</li> </ul> <p><strong>HTML</strong> </p> <pre><code>&lt;div class="yui-skin-sam"&gt; &lt;h1 id="my-carousel-label"&gt;Expert Health Advice&lt;/h1&gt; &lt;div id="container"&gt; &lt;ol id="carousel"&gt; &lt;li class="item"&gt; &lt;a title="View Author's Biography" class="authimg" href="http://health.yahoo.com/experts/skintype/bio/leslie-baumann/"&gt;&lt;img width="125" height="154" alt="Leslie Baumann, M.D." src="http://l.yimg.com/fz/ls/he/blogs/carousel/LeslieBaumann_carousel.png"/&gt;&lt;/a&gt; &lt;h3&gt;&lt;a href="http://health.yahoo.com/experts/skintype/bio/leslie-baumann/"&gt;Leslie Baumann, M.D.&lt;/a&gt;&lt;/h3&gt; &lt;h4&gt;&lt;a href="http://health.yahoo.com/experts/skintype/12135/skin-treatments-for-brides-to-be/"&gt;Skin Treatments for&amp;#8240;&lt;/a&gt;&lt;/h4&gt; &lt;cite&gt;Posted Thu 5.1.08&lt;/cite&gt; &lt;p class="all"&gt;&lt;a href="http://health.yahoo.com/experts/skintype/"&gt;View All Posts &amp;#187;&lt;/a&gt; &lt;/p&gt; &lt;/li&gt; &lt;li class="item"&gt; &lt;a title="View Author's Biography" class="authimg" href="http://health.yahoo.com/experts/deepak/bio/deepak-chopra/"&gt;&lt;img width="125" height="154" alt="Deepak Chopra, M.D." src="http://l.yimg.com/fz/ls/he/blogs/carousel/DeepakChopra_carousel.png"/&gt;&lt;/a&gt; &lt;h3&gt;&lt;a href="http://health.yahoo.com/experts/deepak/bio/deepak-chopra/"&gt;Deepak Chopra, M.D.&lt;/a&gt;&lt;/h3&gt; &lt;h4&gt;&lt;a href="http://health.yahoo.com/experts/deepak/2689/how-you-think-about-illness-affects-your-recovery/"&gt;How You Think About Illness&amp;#8240;&lt;/a&gt;&lt;/h4&gt; &lt;cite&gt;Posted Thu 5.1.08&lt;/cite&gt; &lt;p class="all"&gt;&lt;a href="http://health.yahoo.com/experts/deepak/"&gt;View All Posts &amp;#187;&lt;/a&gt; &lt;/p&gt; &lt;/li&gt; &lt;li class="item"&gt; &lt;a title="View Author's Biography" class="authimg" href="http://health.yahoo.com/experts/nutrition/bio/christine-mckinney-nutrition/"&gt;&lt;img width="125" height="154" class="lz" alt="Christine McKinney, M.S., R.D., C.D.E." src="http://l.yimg.com/fz/ls/he/blogs/carousel/ChristineMcKinney_carousel.png"/&gt;&lt;/a&gt; &lt;h3&gt;&lt;a href="http://health.yahoo.com/experts/nutrition/bio/christine-mckinney-nutrition/"&gt;Christine McKinney, M.S., R.D., C.D.E.&lt;/a&gt;&lt;/h3&gt; &lt;h4&gt;&lt;a href="http://health.yahoo.com/experts/nutrition/12067/fat-how-much-is-enough-of-a-good-thing/"&gt;Fat: How Much Is Enough of a&amp;#8240;&lt;/a&gt;&lt;/h4&gt; &lt;cite&gt;Posted Thu 5.1.08&lt;/cite&gt; &lt;p class="all"&gt;&lt;a href="http://health.yahoo.com/experts/nutrition/"&gt;View All Posts &amp;#187;&lt;/a&gt; &lt;/p&gt; &lt;/li&gt; &lt;li class="item"&gt; &lt;a title="View Author's Biography" class="authimg" href="http://health.yahoo.com/experts/drmao/bio/maoshing-ni/"&gt;&lt;img width="125" height="154" class="lz" alt="Dr. Maoshing Ni" src="http://l.yimg.com/fz/ls/he/blogs/carousel/MaoshingNi_carousel.png"/&gt;&lt;/a&gt; &lt;h3&gt;&lt;a href="http://health.yahoo.com/experts/drmao/bio/maoshing-ni/"&gt;Dr. Maoshing Ni&lt;/a&gt;&lt;/h3&gt; &lt;h4&gt;&lt;a href="http://health.yahoo.com/experts/drmao/13738/centenarian-tips-for-a-long-life/"&gt;Centenarian Tips for a Long&amp;#8240;&lt;/a&gt;&lt;/h4&gt; &lt;cite&gt;Posted Tue 4.29.08&lt;/cite&gt; &lt;p class="all"&gt;&lt;a href="http://health.yahoo.com/experts/drmao/"&gt;View All Posts &amp;#187;&lt;/a&gt; &lt;/p&gt; &lt;/li&gt; &lt;li class="item"&gt; &lt;a title="View Author's Biography" class="authimg" href="http://health.yahoo.com/experts/breastcancer/bio/lillie-shockney/"&gt;&lt;img width="125" height="154" class="lz" alt="Lillie Shockney, R.N., M.A.S." src="http://l.yimg.com/fz/ls/he/blogs/carousel/LillieShockney_carousel.png"/&gt;&lt;/a&gt; &lt;h3&gt;&lt;a href="http://health.yahoo.com/experts/breastcancer/bio/lillie-shockney/"&gt; Lillie Shockney, R.N., M.A.S.&lt;/a&gt;&lt;/h3&gt; &lt;h4&gt;&lt;a href="http://health.yahoo.com/experts/breastcancer/5673/are-you-being-over-or-undertreated/"&gt;Are You Being Over- or&amp;#8240;&lt;/a&gt;&lt;/h4&gt; &lt;cite&gt;Posted Tue 4.29.08&lt;/cite&gt; &lt;p class="all"&gt;&lt;a href="http://health.yahoo.com/experts/breastcancer/"&gt;View All Posts &amp;#187;&lt;/a&gt; &lt;/p&gt; &lt;/li&gt; &lt;li class="item"&gt; &lt;a title="View Author's Biography" class="authimg" href="http://health.yahoo.com/experts/depression/bio/david-neubauer/"&gt;&lt;img width="125" height="154" class="lz" alt="David Neubauer, M.D." src="http://l.yimg.com/fz/ls/he/blogs/carousel/DavidNeubauer_carousel.png"/&gt;&lt;/a&gt; &lt;h3&gt;&lt;a href="http://health.yahoo.com/experts/depression/bio/david-neubauer/"&gt;David Neubauer, M.D.&lt;/a&gt;&lt;/h3&gt; &lt;h4&gt;&lt;a href="http://health.yahoo.com/experts/depression/12445/could-a-breast-cancer-treatment-help-bipolar-disorder/"&gt;Could a Breast Cancer&amp;#8240;&lt;/a&gt;&lt;/h4&gt; &lt;cite&gt;Posted Tue 4.29.08&lt;/cite&gt; &lt;p class="all"&gt;&lt;a href="http://health.yahoo.com/experts/depression/"&gt;View All Posts &amp;#187;&lt;/a&gt; &lt;/p&gt; &lt;/li&gt; &lt;li class="item"&gt; &lt;a title="View Author's Biography" class="authimg" href="http://health.yahoo.com/experts/capessa/bio/capessa/"&gt;&lt;img width="125" height="154" class="lz" alt="Jennifer Tuma-Young" src="http://l.yimg.com/fz/ls/he/blogs/carousel/Capessa_carousel.png"/&gt;&lt;/a&gt; &lt;h3&gt;&lt;a href="http://health.yahoo.com/experts/capessa/bio/capessa/"&gt;Jennifer Tuma-Young&lt;/a&gt;&lt;/h3&gt; &lt;h4&gt;&lt;a href="http://health.yahoo.com/experts/capessa/3473/relieve-stress-with-your-senses/"&gt;Relieve Stress With Your&amp;#8240;&lt;/a&gt;&lt;/h4&gt; &lt;cite&gt;Posted Mon 4.28.08&lt;/cite&gt; &lt;p class="all"&gt;&lt;a href="http://health.yahoo.com/experts/capessa/"&gt;View All Posts &amp;#187;&lt;/a&gt; &lt;/p&gt; &lt;/li&gt; &lt;li class="item"&gt; &lt;a title="View Author's Biography" class="authimg" href="http://health.yahoo.com/experts/healthieryou/bio/lucydanziger/"&gt;&lt;img width="125" height="154" class="lz" alt="Lucy Danziger, SELF Edit" src="http://l.yimg.com/fz/ls/he/blogs/carousel/LucyDanziger_carousel.png"/&gt;&lt;/a&gt; &lt;h3&gt;&lt;a href="http://health.yahoo.com/experts/healthieryou/bio/lucydanziger/"&gt;Lucy Danziger, SELF Edit&lt;/a&gt;&lt;/h3&gt; &lt;h4&gt;&lt;a href="http://health.yahoo.com/experts/healthieryou/2639/de-stress-in-mere-minutes/"&gt;De-Stress in Mere Minutes&lt;/a&gt;&lt;/h4&gt; &lt;cite&gt;Posted Mon 4.28.08&lt;/cite&gt; &lt;p class="all"&gt;&lt;a href="http://health.yahoo.com/experts/healthieryou/"&gt;View All Posts &amp;#187;&lt;/a&gt; &lt;/p&gt; &lt;/li&gt; &lt;li class="item"&gt; &lt;a title="View Author's Biography" class="authimg" href="http://health.yahoo.com/experts/healthnews/bio/simeon-margolis/"&gt;&lt;img width="125" height="154" class="lz" alt="Simeon Margolis, M.D., Ph.D." src="http://l.yimg.com/fz/ls/he/blogs/carousel/SimeonMargolis_carousel.png"/&gt;&lt;/a&gt; &lt;h3&gt;&lt;a href="http://health.yahoo.com/experts/healthnews/bio/simeon-margolis/"&gt;Simeon Margolis, M.D., Ph.D.&lt;/a&gt;&lt;/h3&gt; &lt;h4&gt;&lt;a href="http://health.yahoo.com/experts/healthnews/13879/alzheimer-s-and-dementia-will-you-be-affected/"&gt;Alzheimer's and Dementia: Will&amp;#8240;&lt;/a&gt;&lt;/h4&gt; &lt;cite&gt;Posted Mon 4.28.08&lt;/cite&gt; &lt;p class="all"&gt;&lt;a href="http://health.yahoo.com/experts/healthnews/"&gt;View All Posts &amp;#187;&lt;/a&gt; &lt;/p&gt; &lt;/li&gt; &lt;li class="item"&gt; &lt;a title="View Author's Biography" class="authimg" href="http://health.yahoo.com/experts/intentblog/bio/intentblog/"&gt;&lt;img width="125" height="154" class="lz" alt="Mallika Chopra, IntentBlog" src="http://l.yimg.com/fz/ls/he/blogs/carousel/Intentblog_carousel.png"/&gt;&lt;/a&gt; &lt;h3&gt;&lt;a href="http://health.yahoo.com/experts/intentblog/bio/intentblog/"&gt;Mallika Chopra, IntentBlog&lt;/a&gt;&lt;/h3&gt; &lt;h4&gt;&lt;a href="http://health.yahoo.com/experts/intentblog/2919/treating-a-sore-throat/"&gt;Treating a Sore Throat&lt;/a&gt;&lt;/h4&gt; &lt;cite&gt;Posted Mon 4.28.08&lt;/cite&gt; &lt;p class="all"&gt;&lt;a href="http://health.yahoo.com/experts/intentblog/"&gt;View All Posts &amp;#187;&lt;/a&gt; &lt;/p&gt; &lt;/li&gt; &lt;/ol&gt; &lt;/div&gt; &lt;/div&gt; </code></pre> <p><strong>Javascript</strong></p> <pre><code>window.onload=function(){ (function () { var carousel; YAHOO.util.Event.onDOMReady(function (ev) { var carousel = new YAHOO.widget.Carousel("container", { animation: { speed: 0.5 }, describedby: "my-carousel-label" }); carousel.render(); // get ready for rendering the widget carousel.show(); // display the widget }); })(); } </code></pre> <p>Any help would be appreciated.</p>
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload