Big load on browser when on jquery


Warning: count(): Parameter must be an array or an object that implements Countable in /home/styllloz/public_html/qa-theme/donut-theme/qa-donut-layer.php on line 274
0 like 0 dislike
5 views
Good afternoon. Please tell me how to solve this problem. Installed the website plugin magnifier for images. Everything connects and works, but since it is an online store on one page can be up to 20 images and when you hover the mouse on one of images feature is triggered for the whole page. How to restrict it to just one picture? Induced — loaded picture — connect function — removed the mouse — down and so on...

that's the kind of feature I was able to register to activate the library:

$(document).ready(function(){
$(\\'#zoom1\\').hover(function(){
$.getscript(\\'js/cloud-zoom.1.0.2.min.js\\', function(){
testAjax();
});
})
});


the link to the magnifying glass: www.professorcloud.com/mainsite/cloud-zoom.htm

PS. Simply plug the magnifier in Hader as written the example will fail because the output directory on the website is made entirely on Ajax.
by | 5 views

4 Answers

0 like 0 dislike
It seems that in Your code each time you hover (hover) loads the "Cloud Zoom" from the Network (getscript), which in itself is capable of creating enormous stress:
\r
$(document).ready(function(){ $('#zoom1').hover(function(){ $.getscript('js/cloud-zoom.1.0.2.min.js', function(){ testAjax(); }); }); }); 

Appropriate, at least swap the event handlers to at first, once loaded the script "Cloud Zoom", and then (when he came) were appointed handler for the mouse hover on the picture (if $('#zoom1') is just an illustration):
\r
$(function(){ $.getscript('js/cloud-zoom.1.0.2.min.js', function(){ $('#zoom1').hover(function(){ testAjax(); }); }); }); 

In the script "Cloud Zoom", according to his code, does not provide its own mechanism to suspend the effect of a magnifying glass. You, if you were looking for such a mechanism, you can try to pull out the event handlers from the illustrations and galleries:
\r
$('.cloud-zoom, .cloud-zoom-gallery').unbind(); 

After that, you can try to restart the effect of a magnifying glass in a way that in the plugin "Cloud Zoom" is used at the beginning of the code:
\r
$('.cloud-zoom, .cloud-zoom-gallery').CloudZoom(); 

Of course, the perfect job is not guaranteed: it's just obvious "dirty trick" ("dirty hack").
\r
Immediately I will say that "dirty trick", maybe don't need any more: if enough that the plugin "Cloud Zoom" is not started automatically lash out at all the available pictures and galleries on a page (i.e. download a hell of a lot of large illustrations), and started to act only when the mouse is over a picture, it will last only two steps.
\r
First, edit used code "Cloud Zoom", removing from there AutoPlay. In the code Java script autostart goes in one line, but for beauty I will write it in structured form:
\r
$(document).ready(function () { $('.cloud-zoom, .cloud-zoom-gallery').CloudZoom() }); 

\r
Second, instead of removed startup you have to manually write a startup that is triggered when the mouse is over a picture or gallery:
\r
$('.cloud-zoom, .cloud-zoom-gallery').hover(function(){ $(this).CloudZoom(); }); 

If it turns out that a repeated start CloudZoom () that occur after each mouse on, creates unpleasant effects, you can label illustrations and galleries of some note, and remove it after launch CloudZoom():
\r
$('.cloud-zoom, .cloud-zoom-gallery').addClass('CloudZoomNotRunning').hover(function(){ var $this = $(this); if ($this.is('.CloudZoomNotRunning')){ $this.CloudZoom().removeClass('CloudZoomNotRunning'); }; }); 

Naturally, all this code on .CloudZoom() is based, should only run once the code of the plugin "Cloud Zoom" is already loaded getscript().
\r
Exactly the same chain .addClass(...).hover(...), of course, will have time to apply to each new picture or a gallery that is added to the page Aaham.
by
0 like 0 dislike
And why on hover to hang the download of the entire script?
1. In any case, the script should be loaded only 1 time per page.
2. After building (and again after the rebuild) the list of images on the Ajax should be called f-tsiya of inicializacia. For this you need to look in the source code. If not mistaken, this:
$('.cloud-zoom, .cloud-zoom-gallery').CloudZoom();
by
0 like 0 dislike
Don't understand where does the Ajax loupe and, well, let the Ajax catalog is loaded, upon loading (onload callback) do $(catalog).CloudZoom(); and so each time. And why when you hover to load the plugin I did not understand.
by
0 like 0 dislike
without getscript he doesn't, because the hat with Ajax directory doesn't interact at all.
The main problem is that the script runs when mouse hover on all images at once...
This is very much slowing down the browser. And I would like to hover run
only one particular picture, and so with each image...
by

Related questions

0 like 0 dislike
1 answer
0 like 0 dislike
1 answer
0 like 0 dislike
3 answers
0 like 0 dislike
1 answer
110,608 questions
257,186 answers
0 comments
27,379 users