Search Form and Social Buttons

HotThemes Logo and Top Menu

To request a forum account, please login here and open support ticket. Only customers with active order(s) can open forum account!

× Discussion about Hot Effects Slider Joomla module.

Topic-icon HOT Effect rotator conflict with other effect

More
5 years 10 months ago #5962 by missingkid
I'm trying to use THIS making the ENTIRE Effect rotator fade-in when I open my homepage.
But I can't make it, it seems something is conflicting to each other,
I tried to disable the rotator's jQuery but didn't work.

I don't want to put a mask over the rotator and make the mask fade-out. If it's possible, I want make the rotator itself fade-in.

Any suggestion is greatly appreciate.

Thanks.
Taylor

P.S. Please excuse my bad English, I used to speak Chinese :(

Please Log in to join the conversation.

More
5 years 10 months ago #5963 by ivan.milic
Hi,

If you want to do that only to HOT Effect rotator this would be solution:
Add this in index.php of template just before </head>:


<style type="text/css">
.nivoSlider{
opacity: 0;
filter:Alpha(Opacity=0);
}
</style>
<script type="text/javascript">

window.onload = function()
{
if(!jQuery)
{
alert('jQuery is not referenced!Please add reference to head section of your page!');
}
else{
var slider = jQuery('.nivoSlider');
if(slider[0]){
slider.delay(1000).fadeIn(2500);
}
}

};

</script>

Please Log in to join the conversation.

More
5 years 10 months ago #5964 by missingkid
Hello,

Thanks for fast reply.

I only use the rotator in my website's Mainpage,
and there are several jQuery modules in other pages.
So, is there a way to add fade-in effect to these different jQuery modules with the method I mentioned before, and use just one solution to solve the conflict?

Apparently it is loading jQuery more than once cause the problem,
maybe you can give me some suggestions about how to load jQuery library appropriately.


also,

<style type="text/css">
.nivoSlider {
opacity: 0;
filter:Alpha(Opacity=0);
}
</style>

It can't pass W3C's CSS validation so may not a good idea.

Thanks again.

Please Log in to join the conversation.

More
5 years 10 months ago #5965 by ivan.milic
Hi,

Make sure reference is in head section on page before any jscript call. Like this:
<script type="text/javascript" src=" code.jquery.com/jquery-latest.min.js "></script>

(note that above if global remote reference to latest jquery version. You probably have some folder with your site that contains jquery )

If needed you also have to have reference to jquery.ui,js and jQuery.ui.css

Add this script block after that reference:
<script type="text/javascript">
jQuery.noConflict();
</script>

Go from module to module and disable local loading of jQuery.
I'am not sure if you are using our templates and modules. If yes, then in every module that requires jQuery there is parameter named "Load JQuery".

Please Log in to join the conversation.

Time to create page: 0.111 seconds

Links, Partners and Social Media