I am not familiar with JS at all and I was wondering how I can get this working in my Magento shop:
I apologise in advance if this is a stupid question.
0
Add a comment
|
3 Answers
add the jquery library first then add your js code. also the $ variable is reserved for prototype in magento so you need to add noConflict()
<script>
jQuery.noConflict();
jQuery('#product_pop_before').delay(3000).fadeOut('slow', function(){
jQuery('#product_pop').fadeIn('slow');
jQuery('#product_pop').delay(4000).fadeOut(),
jQuery('#product_pop_before').delay(5000).fadeIn('slow');
});
</script>
answered Jun 24, 2016 at 9:47
-
I get
$.noConflict is not a functionI added ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js Commented Jun 24, 2016 at 9:59 -
@MikeTimTurner did you add before this code or after? my mistake it is
jQuery.noConflict();Commented Jun 24, 2016 at 10:01 -
This is great. I can only get it to work with an Onload function. Is there anyway around this? Commented Jun 24, 2016 at 10:17
-
-
Is it possible to run it without a function as I do not want to modify the
<body>tag Commented Jun 24, 2016 at 10:23
Just insert the code in the template you need and wrap it in <script type="text/javascript"></script>
-
I've done that and also created a Onload function but when I inspect it shows this error:
Uncaught TypeError: Cannot read property 'delay' of nullCommented Jun 24, 2016 at 9:39
Use below code:
<script>
jQuery.noConflict();
jQuery('#product_pop_before').delay(3000).fadeOut('slow', function(){
jQuery('#product_pop').fadeIn('slow');
jQuery('#product_pop').delay(4000).fadeOut(),
jQuery('#product_pop_before').delay(5000).fadeIn('slow');
});
</script>
answered Jun 24, 2016 at 10:01
