There is a page . It contains links with anchors to the layers below. Also attached to the page is a script that scrolls to the anchor (layer) specified in the link.
Each of these layers to which the scroll is performed is a mini sketch, when clicked, the image is enlarged. Zoom is implemented using the highslide script.

It is necessary to make everything happen in the following scenario:

Click on the link - Scroll to a layer, and then increase the picture.

In other words, you need to register in the scrolling script, so that when you reach the desired anchor, you click on the sketch. I am not familiar with JavaScript, but I think the task is not difficult!

The script scroll code is:

spScrollToHash = { autor: { name: 'Szen', site: 'http://szenprogs.ru/', page: 'http://szenprogs.ru/blog/plavnyj_skrolling_v_ljubom_napravlenii/2011-06-21-111', ver: '1.0 beta' }, scroll: function (id, speed, typ) { if (id == '' || id == '#' || $(id).length == 0) return false; if (speed == undefined || speed < 1 || speed > 1000) speed = 500; if (typ == undefined || typ < 1 || typ > 3) typ = 1; var par = 'html' if ($.browser.safari) par = 'body'; var offset = $(id).offset(); spScrollToHash.stop(); switch (typ) { case 1: $(par).animate({ scrollTop: offset.top, scrollLeft: offset.left }, speed, function () { document.location.hash = id; }); break; case 2: $(par).animate({ scrollTop: offset.top }, Math.round(speed / 2), function () { $(par).animate({ scrollLeft: offset.left }, Math.round(speed / 2), function () { document.location.hash = id; }); }); break; case 3: $(par).animate({ scrollLeft: offset.left }, Math.round(speed / 2), function () { $(par).animate({ scrollTop: offset.top }, Math.round(speed / 2), function () { document.location.hash = id; }); }); break; } return false; }, stop: function () { $('a[href*="#"]').stop(); }, ready: function (speed, typ) { var id = document.location.hash; spScrollToHash.scroll(id, speed, typ); $('a[href*="#"]').click(function () { id = $(this).attr('href'); id = id.substr(id.indexOf('#')); spScrollToHash.scroll(id, speed, typ); return false; }); } } $(function () { spScrollToHash.ready(400, 1); });

Still here.

    1 answer 1

    try replacing swith in scroll with:

     switch(typ){ case 1: $(par).animate({scrollTop:offset.top,scrollLeft:offset.left},speed,function(){document.location.hash=id;$(id).find('a').click();}); break; case 2: $(par).animate({scrollTop:offset.top},Math.round(speed/2),function(){ $(par).animate({scrollLeft:offset.left},Math.round(speed/2),function(){document.location.hash=id;$(id).find('a').click();}); }); break; case 3: $(par).animate({scrollLeft:offset.left},Math.round(speed/2),function(){ $(par).animate({scrollTop:offset.top},Math.round(speed/2),function(){document.location.hash=id;$(id).find('a').click();}); }); break; }
    • Everything works fine, only it is tied to "id = thumb1" and when you click on different links, it opens the same picture. And if the link is of this type <a href="img/map/objects/3/3.gif" class="highslide" onclick="return hs.expand(this)"> <img src = "img / map / objects /3/3_min.gif "alt =" Highslide JS "title =" 1989 - residential neighborhoods in the 14-15th MCB in the Northern residential district (RP). " height = "56" width = "90" /> </a> - cheh1
    • here it will be difficult to track the element on which you need a click, because with id there is an opportunity to uniquely catch an element, but if you bind to a class, then you need to select the right one from several elements - RedMonkey
    • How to be a friend! Help please, do not own javascript, can there be any solution? - cheh1
    • it all depends on what can be changed, maybe there is where in the net to look at your site? I just don’t quite understand why this is needed, and therefore I can’t even guess how dom looks like - RedMonkey
    • straightened the code, in theory you need it so if you don’t, then set the alert (id) after the switch and then write what it will bring - RedMonkey