{"id":186,"date":"2009-12-12T18:58:27","date_gmt":"2009-12-12T10:58:27","guid":{"rendered":"http:\/\/hyperseo.ru\/?p=186"},"modified":"2011-01-21T15:24:05","modified_gmt":"2011-01-21T07:24:05","slug":"plavayushhee-bokovoe-menyu-zaplyv-s-jquery","status":"publish","type":"post","link":"https:\/\/hyperseo.ru\/?p=186","title":{"rendered":"\u041f\u043b\u0430\u0432\u0430\u044e\u0449\u0435\u0435 \u0431\u043e\u043a\u043e\u0432\u043e\u0435 \u043c\u0435\u043d\u044e&nbsp;&mdash; \u0437\u0430\u043f\u043b\u044b\u0432 \u0441 jQuery"},"content":{"rendered":"<p>\u0422\u0417. \u041d\u0430 \u0441\u0430\u0439\u0442\u0435 \u0442\u0440\u0435\u0431\u0443\u0435\u0442\u0441\u044f \u0441\u0434\u0435\u043b\u0430\u0442\u044c \u043f\u043b\u0430\u0432\u0430\u044e\u0449\u0435\u0435 \u0432\u0435\u0440\u0442\u0438\u043a\u0430\u043b\u044c\u043d\u043e\u0435 \u043c\u0435\u043d\u044e (\u0447\u0442\u043e\u0431\u044b \u043f\u0440\u0438 \u0441\u043a\u0440\u043e\u043b\u043b\u0438\u043d\u0433\u0435 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b \u043c\u0435\u043d\u044e \u0432\u0441\u0435\u0433\u0434\u0430 \u0431\u044b\u043b\u043e \u043d\u0430\u0432\u0438\u0434\u0443). \u0417\u0430\u0434\u0430\u0447\u0430 \u0443\u0441\u043b\u043e\u0436\u043d\u044f\u0435\u0442\u0441\u044f \u0442\u0435\u043c, \u0447\u0442\u043e \u0432\u0435\u0440\u0442\u0438\u043a\u0430\u043b\u044c\u043d\u043e\u0435 \u043c\u0435\u043d\u044e \u0438\u0434\u0451\u0442 \u043d\u0435 \u043e\u0442 \u0441\u0430\u043c\u043e\u0433\u043e \u0432\u0435\u0440\u0445\u0430&nbsp;&mdash; \u0440\u0430\u0437\u0431\u0438\u0435\u043d\u0438\u0435 \u043d\u0430 \u043a\u043e\u043b\u043e\u043d\u043a\u0438 \u043d\u0430\u0447\u0438\u043d\u0430\u0435\u0442\u0441\u044f \u043f\u043e\u0441\u043b\u0435 \u0448\u0430\u043f\u043a\u0438 \u0438 \u0433\u043e\u0440\u0438\u0437\u043e\u043d\u0442\u0430\u043b\u044c\u043d\u043e\u0433\u043e \u043c\u0435\u043d\u044e. \u0421\u043b\u0435\u0434\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u043d\u043e, \u0432\u0435\u0440\u0442\u0438\u043a\u0430\u043b\u044c\u043d\u043e\u0435 \u043c\u0435\u043d\u044e \u0434\u043e\u043b\u0436\u043d\u043e \u043f\u043b\u0430\u0432\u0430\u0442\u044c \u0442\u043e\u043b\u044c\u043a\u043e \u0442\u043e\u0433\u0434\u0430, \u043a\u043e\u0433\u0434\u0430 \u0435\u0433\u043e \u0432\u0435\u0440\u0445\u043d\u044f\u044f \u0433\u0440\u0430\u043d\u0438\u0446\u0430 \u0441\u043a\u0440\u044b\u0432\u0430\u0435\u0442\u0441\u044f \u0437\u0430 \u0432\u0435\u0440\u0445\u043d\u0438\u043c \u043a\u0440\u0430\u0435\u043c \u043e\u0431\u043b\u0430\u0441\u0442\u0438 \u043f\u0440\u043e\u0441\u043c\u043e\u0442\u0440\u0430 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0430.<\/p>\n<p style=\"text-align: center;\"><img loading=\"lazy\" class=\"aligncenter size-full wp-image-187\" title=\"\u043f\u043b\u0430\u0432\u0430\u044e\u0449\u0435\u0435 \u0431\u043e\u043a\u043e\u0432\u043e\u0435 \u043c\u0435\u043d\u044e\" src=\"https:\/\/hyperseo.ru\/wp-content\/uploads\/2009\/12\/ejva-menu.jpg\" alt=\"\u043f\u043b\u0430\u0432\u0430\u044e\u0449\u0435\u0435 \u0431\u043e\u043a\u043e\u0432\u043e\u0435 \u043c\u0435\u043d\u044e\" width=\"350\" height=\"255\" srcset=\"https:\/\/hyperseo.ru\/wp-content\/uploads\/2009\/12\/ejva-menu.jpg 350w, https:\/\/hyperseo.ru\/wp-content\/uploads\/2009\/12\/ejva-menu-300x218.jpg 300w\" sizes=\"(max-width: 350px) 100vw, 350px\" \/><\/p>\n<p><!--more--><\/p>\n<h2>\u0420\u0435\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u044f \u043f\u043b\u0430\u0432\u0430\u044e\u0449\u0435\u0433\u043e \u0432\u0435\u0440\u0442\u0438\u043a\u0430\u043b\u044c\u043d\u043e\u0433\u043e \u043c\u0435\u043d\u044e<\/h2>\n<p>\u0414\u043b\u044f \u0440\u0435\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u0438 \u043f\u043b\u0430\u0432\u0430\u043d\u0438\u044f \u043c\u0435\u043d\u044e \u044f \u0431\u0443\u0434\u0443 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c <strong>JavaScript<\/strong> \u0438 \u0435\u0433\u043e \u0432\u044b\u0441\u0448\u0435\u0435 \u0432\u043e\u043f\u043b\u043e\u0449\u0435\u043d\u0438\u0435&nbsp;&mdash; <strong>jQuery<\/strong>. \u0418\u0441\u0442\u043e\u0440\u0438\u0447\u0435\u0441\u043a\u0438 \u0442\u0430\u043a \u0441\u043b\u043e\u0436\u0438\u043b\u043e\u0441\u044c, \u0447\u0442\u043e \u0434\u043b\u044f \u0434\u0430\u043d\u043d\u043e\u0433\u043e \u0441\u0430\u0439\u0442\u0430 \u044f \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u044e jQuery \u0432\u0435\u0440\u0441\u0438\u0438 1.2.6, \u043f\u043e\u0442\u043e\u043c\u0443 \u043c\u043e\u0436\u043d\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u043c\u043e\u0439 \u043f\u0440\u0438\u043c\u0435\u0440 \u043d\u0430 \u0444\u0440\u0435\u0439\u043c\u0432\u043e\u0440\u043a\u0435 \u043c\u043e\u0435\u0439 \u0432\u0435\u0440\u0441\u0438\u0438 \u0438 \u0432\u044b\u0448\u0435. \u041f\u043e\u0434\u043a\u043b\u044e\u0447\u0430\u0435\u043c jQuery:<\/p>\n<pre class=\"brush:xml\">&lt;html&gt;\n&lt;head&gt;\n...\n&lt;script src=\"js\/jquery-1.2.6.js\" type=\"text\/javascript\"&gt;&lt;\/script&gt;\n&lt;\/head&gt;<\/pre>\n<p>\u041f\u0440\u0438\u043c\u0435\u0440\u043d\u043e \u0442\u0430\u043a \u0432\u044b\u0433\u043b\u044f\u0434\u0438\u0442 HTML-\u043a\u043e\u0434 \u0441\u0430\u043c\u043e\u0433\u043e \u043c\u0435\u043d\u044e (\u0437\u0430 \u0438\u0441\u043a\u043b\u044e\u0447\u0435\u043d\u0438\u0435\u043c \u0442\u0435\u0445\u043d\u0438\u0447\u0435\u0441\u043a\u0438\u0445 \u043c\u043e\u043c\u0435\u043d\u0442\u043e\u0432, \u043d\u0435 \u043a\u0430\u0441\u0430\u044e\u0449\u0438\u0445\u0441\u044f \u0434\u0430\u043d\u043d\u043e\u0439 \u0442\u0435\u043c\u044b):<\/p>\n<pre class=\"brush:xml\">&lt;div id=\"lmenu\"&gt;\n&lt;ul&gt;\n&lt;li&gt;&lt;a href=\"page-1.html''&gt;\u0421\u0442\u0440\u0430\u043d\u0438\u0446\u0430 1&lt;\/a&gt;\n&lt;li&gt;&lt;a href=\"page-1.html''&gt;\u0421\u0442\u0440\u0430\u043d\u0438\u0446\u0430 2&lt;\/a&gt;\n&lt;li&gt;&lt;a href=\"page-1.html''&gt;\u0421\u0442\u0440\u0430\u043d\u0438\u0446\u0430 3&lt;\/a&gt;\n...\n&lt;\/ul&gt;\n&lt;\/div&gt;<\/pre>\n<p>\u041a\u043b\u044e\u0447\u0435\u0432\u044b\u043c \u043c\u043e\u043c\u0435\u043d\u0442\u043e\u043c \u0437\u0434\u0435\u0441\u044c \u044f\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u043f\u0440\u0438\u0441\u0432\u043e\u0435\u043d\u0438\u0435 \u0441\u043b\u043e\u044e \u043c\u0435\u043d\u044e \u0438\u0434\u0435\u043d\u0442\u0438\u0444\u0438\u043a\u0430\u0442\u043e\u0440\u0430 &laquo;lmenu&raquo;&nbsp;&mdash; \u043c\u043e\u0436\u043d\u043e \u043f\u043e\u0438\u043c\u0435\u043d\u043e\u0432\u0430\u0442\u044c \u043b\u044e\u0431\u044b\u043c \u0434\u0440\u0443\u0433\u0438\u043c \u0443\u043d\u0438\u043a\u0430\u043b\u044c\u043d\u044b\u043c \u0438\u043c\u0435\u043d\u0435\u043c \u0438 \u0434\u0430\u043b\u0435\u0435 \u043e\u0431\u0440\u0430\u0449\u0430\u0442\u044c\u0441\u044f \u043a \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u0443 \u043f\u043e \u044d\u0442\u043e\u043c\u0443 \u0438\u043c\u0435\u043d\u0438. \u041d\u0435\u043c\u043d\u043e\u0433\u043e \u043e \u0441\u0442\u0438\u043b\u044f\u0445. \u0427\u0442\u043e\u0431\u044b \u0438\u043c\u0435\u0442\u044c \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e\u0441\u0442\u044c \u0438\u0437\u043c\u0435\u043d\u044f\u0442\u044c \u043f\u043e\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u043f\u043e \u0432\u0435\u0440\u0442\u0438\u043a\u0430\u043b\u0438 \u0441\u043b\u043e\u044e \u043c\u0435\u043d\u044e, \u0435\u043c\u0443 \u043d\u0430\u0434\u043e \u0437\u0430\u0434\u0430\u0442\u044c \u0430\u0431\u0441\u043e\u043b\u044e\u0442\u043d\u043e\u0435 \u043f\u043e\u0437\u0438\u0446\u0438\u043e\u043d\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u0435. \u041f\u0440\u0438 \u044d\u0442\u043e\u043c \u043d\u0430\u0434\u043e \u0443\u0447\u0435\u0442\u044c, \u0447\u0442\u043e \u0430\u0431\u0441\u043e\u043b\u044e\u0442\u043d\u043e \u043f\u043e\u0437\u0438\u0446\u0438\u043e\u043d\u0438\u0440\u043e\u0432\u0430\u043d\u043d\u044b\u0435 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u044b \u043d\u0435 \u0443\u0447\u0430\u0441\u0442\u0432\u0443\u044e\u0442 \u0432 \u0440\u0430\u0437\u043c\u0435\u0442\u043a\u0435 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b (\u044d\u043b\u0435\u043c\u0435\u043d\u0442\u044b \u043c\u043e\u0433\u0443\u0442 \u043d\u0430\u043a\u043b\u0430\u0434\u044b\u0432\u0430\u0442\u044c\u0441\u044f \u0434\u0440\u0443\u0433 \u043d\u0430 \u0434\u0440\u0443\u0433\u0430, \u0435\u0441\u043b\u0438 \u043d\u0435 \u0437\u0430\u0434\u0430\u0442\u044c \u0434\u043e\u043f\u043e\u043b\u043d\u0438\u0442\u0435\u043b\u044c\u043d\u044b\u0435 \u043e\u0442\u0441\u0442\u0443\u043f\u044b). \u0412\u043e\u0442 \u043c\u043e\u0438 \u0441\u0442\u0438\u043b\u0438 \u0434\u043b\u044f \u043c\u0435\u043d\u044e \u0438 \u043a\u043e\u043d\u0442\u0435\u043d\u0442\u043d\u043e\u0439 \u0447\u0430\u0441\u0442\u0438 (\u043a\u043e\u0442\u043e\u0440\u0430\u044f \u0440\u0430\u0441\u043f\u043e\u043b\u0430\u0433\u0430\u0435\u0442\u0441\u044f \u0441\u043f\u0440\u0430\u0432\u0430 \u043e\u0442 \u043c\u0435\u043d\u044e):<\/p>\n<pre class=\"brush:css\">#lmenu {\n        position:absolute;\n        top: 357px;\n\twidth: 250px;\n}\nDIV.content {\n\tmargin: 10px 10px 0 0;\n\tfloat: right;\n\twidth: 675px;\n}<\/pre>\n<p>\u0417\u043d\u0430\u0447\u0435\u043d\u0438\u0435 &laquo;top: 357px;&raquo; \u0431\u044b\u043b\u043e \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u043e \u0437\u0430\u0440\u0430\u043d\u0435\u0435. \u041f\u0440\u0438 \u043f\u043e\u043c\u043e\u0449\u0438 JavaScript. \u0414\u043b\u044f \u044d\u0442\u043e\u0433\u043e \u0432 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0443 \u0431\u044b\u043b \u0432\u0441\u0442\u0430\u0432\u043b\u0435\u043d \u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0438\u0439 JS-\u043a\u043e\u0434:<\/p>\n<pre class=\"brush:js\">&lt;script type = \"text\/javascript\"&gt;\n  $(document).ready(function () {\n    alert ($('#lmenu').css('top'));\n  }\n&lt;\/script&gt;<\/pre>\n<p>\u042d\u0442\u043e\u0442 \u0441\u043a\u0440\u0438\u043f\u0442 \u043e\u0442\u043e\u0431\u0440\u0430\u0437\u0438\u043b \u0432 \u043c\u043e\u0434\u0430\u043b\u044c\u043d\u043e\u043c \u043e\u043a\u043d\u0435 \u0441\u0432\u043e\u0439\u0441\u0442\u0432\u043e &laquo;top&raquo; \u043c\u043e\u0435\u0433\u043e \u043c\u0435\u043d\u044e&nbsp;&mdash; \u0442\u043e \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435, \u043a\u043e\u0442\u043e\u0440\u043e\u0435 \u0431\u044b\u043b\u043e \u043f\u0440\u0438\u043d\u044f\u0442\u043e \u043f\u0440\u0438 \u0440\u0430\u0437\u043c\u0435\u0442\u043a\u0435 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u043e\u043c \u0438\u0437\u043d\u0430\u0447\u0430\u043b\u044c\u043d\u043e, \u0431\u0435\u0437 \u044f\u0432\u043d\u043e\u0433\u043e \u0443\u043a\u0430\u0437\u0430\u043d\u0438\u044f. \u042d\u0442\u043e \u0447\u0438\u0441\u043b\u043e \u043d\u0430\u043c \u0435\u0449\u0451 \u043f\u0440\u0438\u0433\u043e\u0434\u0438\u0442\u0441\u044f. \u0422\u0435\u043f\u0435\u0440\u044c \u0432\u0441\u0451 \u0433\u043e\u0442\u043e\u0432\u043e \u043a \u0442\u043e\u043c\u0443, \u0447\u0442\u043e\u0431\u044b \u043d\u0430\u043f\u0438\u0441\u0430\u0442\u044c \u043e\u0441\u043d\u043e\u0432\u043d\u043e\u0439 \u043a\u043e\u0434, \u043e\u0431\u0435\u0441\u043f\u0435\u0447\u0438\u0432\u0430\u044e\u0449\u0438\u0439 \u044d\u0444\u0444\u0435\u043a\u0442 \u043f\u043b\u0430\u0432\u0430\u043d\u0438\u044f \u043c\u0435\u043d\u044e.<\/p>\n<pre class=\"brush:js\">&lt;script type = \"text\/javascript\"&gt;\n\/\/ \u043a\u0430\u043a\u0430\u044f \u0447\u0430\u0441\u0442\u044c \u043e\u043a\u043d\u0430 \u043f\u0440\u043e\u0441\u043a\u0440\u043e\u043b\u043b\u0435\u043d\u0430 - \u043d\u0430\u0447\u0430\u043b\u044c\u043d\u043e\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435\nvar scroll_top = 0;\n\/\/ \u044d\u0442\u043e\u0442 \u043a\u043e\u0434 \u0431\u0443\u0434\u0435\u0442 \u0432\u044b\u043f\u043e\u043b\u043d\u0435\u043d \u0441\u0440\u0430\u0437\u0443 \u043f\u043e\u0441\u043b\u0435 \u0437\u0430\u0433\u0440\u0443\u0437\u043a\u0438 \u0434\u043e\u043a\u0443\u043c\u0435\u043d\u0442\u0430:\n$(document).ready(function(){\n  \/\/ \u043e\u0442\u0441\u0442\u0443\u043f \u043c\u0435\u043d\u044e \u043e\u0442 \u0432\u0435\u0440\u0445\u043d\u0435\u0433\u043e \u043a\u0440\u0430\u044f \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b\n  var lmenu_top = parseInt ($('#lmenu').css('top'));\n  \/\/ \u0441\u043c\u0435\u0449\u0435\u043d\u0438\u0435 \u043c\u0435\u043d\u044e \u043f\u043e \u0432\u0435\u0440\u0442\u0438\u043a\u0430\u043b\u0438 - \u043d\u0430\u0447\u0430\u043b\u044c\u043d\u043e\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435\n  var offset_lmenu = 0;\n  \/\/ \u044d\u0442\u043e\u0442 \u043a\u043e\u0434 \u0431\u0443\u0434\u0435\u0442 \u0432\u044b\u043f\u043e\u043b\u043d\u0435\u043d \u043f\u0440\u0438 \u0441\u043a\u0440\u043e\u043b\u043b\u0438\u043d\u0433\u0435 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b:\n  $(window).scroll(function () {\n    \/\/ \u043a\u0430\u043a\u0430\u044f \u0447\u0430\u0441\u0442\u044c \u043e\u043a\u043d\u0430 \u043f\u0440\u043e\u0441\u043a\u0440\u043e\u043b\u043b\u0435\u043d\u0430 (\u0432 \u043f\u0438\u043a\u0441\u0435\u043b\u044f\u0445)\n    scroll_top = $(document).scrollTop();\n    \/\/ \u043c\u0435\u043d\u044f\u0435\u043c \u043f\u043e\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u043c\u0435\u043d\u044e, \u0435\u0441\u043b\u0438 \u044d\u0442\u043e \u043d\u0443\u0436\u043d\u043e\n    if (scroll_top &gt; lmenu_top || offset_lmenu &gt; 0) {\n      \/\/ \u043d\u043e\u0432\u043e\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 \u0441\u043c\u0435\u0449\u0435\u043d\u0438\u044f \u043c\u0435\u043d\u044e\n      offset_lmenu = scroll_top - lmenu_top;\n      \/\/ \u043f\u0435\u0440\u0435\u0442\u0430\u0441\u043a\u0438\u0432\u0430\u0435\u043c \u043c\u0435\u043d\u044e\n      $('#lmenu').animate({top:lmenu_top+offset_lmenu},{duration:300,queue:false});\n    }\n  });\n});\n&lt;\/script&gt;<\/pre>\n<p>\u041a\u043b\u044e\u0447\u0435\u0432\u0443\u044e \u0440\u043e\u043b\u044c \u0437\u0434\u0435\u0441\u044c \u0438\u0433\u0440\u0430\u0435\u0442 \u0444\u0443\u043d\u043a\u0446\u0438\u044f $(&#39;#lmenu&#39;).animate ()&nbsp;&mdash; \u043e\u043d\u0430 \u0430\u043d\u0438\u043c\u0438\u0440\u043e\u0432\u0430\u043d\u043e \u0438\u0437\u043c\u0435\u043d\u044f\u0435\u0442 \u0441\u0432\u043e\u0439\u0441\u0442\u0432\u043e &laquo;top&raquo; \u043d\u0430\u0448\u0435\u0433\u043e \u043c\u0435\u043d\u044e. {duration:300,queue:false}&nbsp;&mdash; \u044d\u0442\u043e \u0432\u0440\u0435\u043c\u044f \u0432\u044b\u043f\u043e\u043b\u043d\u0435\u043d\u0438\u044f \u044d\u0444\u0444\u0435\u043a\u0442\u0430 \u0432 \u043c\u0438\u043b\u043b\u0438\u0441\u0435\u043a\u0443\u043d\u0434\u0430\u0445. \u0417\u0430\u0434\u0435\u0440\u0436\u043a\u0443 \u043c\u043e\u0436\u043d\u043e \u0443\u043a\u0430\u0437\u0430\u0442\u044c \u043f\u0440\u043e\u0441\u0442\u043e \u0447\u0438\u0441\u043b\u043e\u043c, \u043d\u043e \u0442\u043e\u0433\u0434\u0430 \u043c\u0435\u043d\u044e \u043f\u0440\u0438 \u0441\u043a\u0440\u043e\u043b\u043b\u0438\u043d\u0433\u0435 \u0434\u0451\u0440\u0433\u0430\u0435\u0442\u0441\u044f.<\/p>\n<p>\u0414\u0430\u043b\u0435\u0435 \u0440\u0435\u0448\u0435\u043d\u043e \u0431\u044b\u043b\u043e \u0434\u043e\u0431\u0430\u0432\u0438\u0442\u044c \u043a \u043c\u0435\u043d\u044e \u043a\u043d\u043e\u043f\u043a\u0443 &laquo;\u0432\u0432\u0435\u0440\u0445&raquo;&nbsp;&mdash; \u0442\u0430\u043a, \u0447\u0442\u043e\u0431\u044b \u044d\u0442\u0430 \u043a\u043d\u043e\u043f\u043a\u0430 \u043f\u043e\u044f\u0432\u043b\u044f\u043b\u0430\u0441\u044c \u0442\u043e\u0433\u0434\u0430, \u043a\u043e\u0433\u0434\u0430 \u043c\u0435\u043d\u044e \u043d\u0430\u0447\u0438\u043d\u0430\u0435\u0442 \u043f\u043b\u044b\u0442\u044c \u0432\u043d\u0438\u0437, \u0438 \u043f\u0440\u043e\u043f\u0430\u0434\u0430\u043b\u0430, \u043a\u043e\u0433\u0434\u0430 \u043c\u0435\u043d\u044e \u0434\u043e\u043f\u043b\u044b\u0432\u0430\u0435\u0442 \u0434\u043e \u0432\u0435\u0440\u0445\u043d\u0435\u0439 \u0447\u0430\u0441\u0442\u0438 \u0433\u0440\u0430\u043d\u0438\u0446\u044b. \u041a \u043c\u0435\u043d\u044e \u0434\u043e\u0431\u0430\u0432\u043b\u044f\u0435\u043c \u0435\u0449\u0451 \u043e\u0434\u0438\u043d \u043f\u0443\u043d\u043a\u0442:<\/p>\n<pre class=\"brush:xml\">&lt;li id=\"scroll_on_top\"&gt;&lt;input type=\"button\" value=\"\u0412\u0432\u0435\u0440\u0445\" onClick=\"scrollit()\"&gt;<\/pre>\n<p>\u041f\u0440\u0438 \u043f\u043e\u043c\u043e\u0449\u0438 \u0441\u0442\u0438\u043b\u0435\u0439 \u0434\u0435\u043b\u0430\u0435\u043c \u044d\u0442\u043e\u0442 \u043f\u0443\u043d\u043a\u0442 \u0438\u0437\u043d\u0430\u0447\u0430\u043b\u044c\u043d\u043e \u043d\u0435\u0432\u0438\u0434\u0438\u043c\u044b\u043c:<\/p>\n<pre class=\"brush:css\">#scroll_on_top {\n\tdisplay: none;\n}<\/pre>\n<p>\u041e\u043f\u0438\u0441\u044b\u0432\u0430\u0435\u043c \u0444\u0443\u043d\u043a\u0446\u0438\u044e, \u043a\u043e\u0442\u043e\u0440\u0430\u044f \u0431\u0443\u0434\u0435\u0442 \u0432\u044b\u043f\u043e\u043b\u043d\u044f\u0442\u044c\u0441\u044f \u043f\u0440\u0438 \u043d\u0430\u0436\u0430\u0442\u0438\u0438 \u043a\u043d\u043e\u043f\u043a\u0438 &laquo;\u0412\u0432\u0435\u0440\u0445&raquo;:<\/p>\n<pre class=\"brush:js\">&lt;script type = \"text\/javascript\"&gt;\nfunction scrollit () {\n  for (i=scroll_top; i&gt;200; i=i-200) { self.scroll(1,i) }\n  self.scroll(1,0)\n}\n&lt;\/script&gt;<\/pre>\n<p>\u0417\u0434\u0435\u0441\u044c \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0441\u044f \u0435\u0449\u0451 \u043d\u0435 \u0443\u043f\u043e\u043c\u044f\u043d\u0443\u0442\u0430\u044f \u043f\u0435\u0440\u0435\u043c\u0435\u043d\u043d\u0430\u044f &laquo;scroll_top&raquo;&nbsp;&mdash; \u0435\u0451 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 \u0431\u0443\u0434\u0435\u043c \u043f\u043e\u043b\u0443\u0447\u0430\u0442\u044c \u0432\u043e \u0432\u0440\u0435\u043c\u044f \u0441\u043a\u0440\u043e\u043b\u043b\u0438\u043d\u0433\u0430 \u043f\u043e \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0435:<\/p>\n<pre class=\"brush:js\">&lt;script type = \"text\/javascript\"&gt;\n  $(window).scroll(function () {\n    scroll_top = $(document).scrollTop();\n  }\n&lt;\/script&gt;<\/pre>\n<p>\u041f\u0440\u0438 \u043d\u0430\u0436\u0430\u0442\u0438\u0438 \u043d\u0430 \u043a\u043d\u043e\u043f\u043a\u0443 &laquo;\u0412\u0432\u0435\u0440\u0445&raquo; \u0437\u0430\u043f\u0443\u0441\u043a\u0430\u0435\u0442\u0441\u044f \u0446\u0438\u043a\u043b, \u0432 \u043a\u043e\u0442\u043e\u0440\u043e\u043c \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 \u043f\u0440\u043e\u0441\u043a\u0440\u043e\u043b\u043b\u0435\u043d\u043d\u043e\u0441\u0442\u0438 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b \u0443\u043c\u0435\u043d\u044c\u0448\u0430\u0435\u0442\u0441\u044f \u043e\u0442 \u0442\u0435\u043a\u0443\u0449\u0435\u0433\u043e \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f \u0434\u043e \u043d\u0443\u043b\u044f \u043f\u0440\u0438 \u043f\u043e\u043c\u043e\u0449\u0438 \u0444\u0443\u043d\u043a\u0446\u0438\u0438 self.scroll (1,i). \u0414\u043b\u044f \u0442\u043e\u0433\u043e, \u0447\u0442\u043e\u0431\u044b \u043f\u043e\u043a\u0430\u0437\u0430\u0442\u044c \u0438 \u0441\u043a\u0440\u044b\u0442\u044c \u043a\u043d\u043e\u043f\u043a\u0443 &laquo;\u0412\u0432\u0435\u0440\u0445&raquo; \u0432 \u043d\u0443\u0436\u043d\u044b\u0439 \u043c\u043e\u043c\u0435\u043d\u0442 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u044e\u0442\u0441\u044f \u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0438\u0435 \u0438\u043d\u0441\u0442\u0440\u0443\u043a\u0446\u0438\u0438 \u0441\u043e\u043e\u0442\u0432\u0435\u0442\u0441\u0442\u0432\u0435\u043d\u043d\u043e:<\/p>\n<pre class=\"brush:js\">$('#scroll_on_top').css('display','list-item');\n$('#scroll_on_top').css('display','none');\n&lt;\/pre&gt;\n\u0421\u043e\u0431\u0438\u0440\u0430\u0435\u043c \u0432\u0441\u0451 \u0432\u044b\u0448\u0435\u043e\u043f\u0438\u0441\u0430\u043d\u043d\u043e\u0435 \u0432 \u043a\u0443\u0447\u0443. \u0422\u0435\u043f\u0435\u0440\u044c \u0431\u0435\u0437 \u043a\u043e\u043c\u043c\u0435\u043d\u0442\u0430\u0440\u0438\u0435\u0432, \u0447\u0442\u043e\u0431\u044b \u043d\u0435 \u0437\u0430\u0433\u0440\u0443\u0436\u0430\u0442\u044c \u043a\u043e\u0434:\n&lt;pre lang=\"javascript\" line=\"1\" escaped=\"true\"&gt;&lt;script type = \"text\/javascript\"&gt;\nvar scroll_top = 0;\n$(document).ready(function(){\n  var lmenu_top = parseInt ($('#lmenu').css('top'));\n  var offset_lmenu = 0;\n  $(window).scroll(function () {\n    scroll_top = $(document).scrollTop();\n    if (scroll_top &gt; lmenu_top || offset_lmenu &gt; 0) {\n      if (offset_lmenu == 0) { $('#scroll_on_top').css('display','list-item'); }\n      offset_lmenu = scroll_top - lmenu_top;\n      if (offset_lmenu &lt; 0) {\n        offset_lmenu = 0;\n        $('#scroll_on_top').css('display','none');\n      }\n      $('#lmenu').animate({top:lmenu_top+offset_lmenu},{duration:300,queue:false});\n    }\n  });\n});\nfunction scrollit () {\n  for (i=scroll_top; i&gt;200; i=i-200) { self.scroll(1,i) }\n  self.scroll(1,0)\n}\n&lt;\/script&gt;<\/pre>\n<p>\u0421\u0430\u0439\u0442, \u0434\u043b\u044f \u043a\u043e\u0442\u043e\u0440\u043e\u0433\u043e \u0432\u0441\u0451 \u044d\u0442\u043e \u0434\u0435\u043b\u0430\u043b\u043e\u0441\u044c, \u0441\u0433\u043e\u0440\u0435\u043b \u0432 \u0430\u0442\u043c\u043e\u0441\u0444\u0435\u0440\u0435, \u043f\u043e\u0442\u043e\u043c\u0443 \u0440\u0430\u0431\u043e\u0447\u0438\u0439 \u043f\u0440\u0438\u043c\u0435\u0440 \u0441\u0435\u0439\u0447\u0430\u0441 \u044f \u0432\u0430\u043c \u0434\u0430\u0436\u0435 \u043d\u0435 \u043f\u043e\u043a\u0430\u0436\u0443. \ud83d\ude42<\/p>\n","protected":false},"excerpt":{"rendered":"<p>\u0422\u0417. \u041d\u0430 \u0441\u0430\u0439\u0442\u0435 \u0442\u0440\u0435\u0431\u0443\u0435\u0442\u0441\u044f \u0441\u0434\u0435\u043b\u0430\u0442\u044c \u043f\u043b\u0430\u0432\u0430\u044e\u0449\u0435\u0435 \u0432\u0435\u0440\u0442\u0438\u043a\u0430\u043b\u044c\u043d\u043e\u0435 \u043c\u0435\u043d\u044e (\u0447\u0442\u043e\u0431\u044b \u043f\u0440\u0438 \u0441\u043a\u0440\u043e\u043b\u043b\u0438\u043d\u0433\u0435 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b \u043c\u0435\u043d\u044e \u0432\u0441\u0435\u0433\u0434\u0430 \u0431\u044b\u043b\u043e \u043d\u0430\u0432\u0438\u0434\u0443). \u0417\u0430\u0434\u0430\u0447\u0430 \u0443\u0441\u043b\u043e\u0436\u043d\u044f\u0435\u0442\u0441\u044f \u0442\u0435\u043c, \u0447\u0442\u043e \u0432\u0435\u0440\u0442\u0438\u043a\u0430\u043b\u044c\u043d\u043e\u0435 \u043c\u0435\u043d\u044e \u0438\u0434\u0451\u0442 \u043d\u0435 \u043e\u0442 \u0441\u0430\u043c\u043e\u0433\u043e \u0432\u0435\u0440\u0445\u0430&nbsp;&mdash; \u0440\u0430\u0437\u0431\u0438\u0435\u043d\u0438\u0435 \u043d\u0430 \u043a\u043e\u043b\u043e\u043d\u043a\u0438 \u043d\u0430\u0447\u0438\u043d\u0430\u0435\u0442\u0441\u044f \u043f\u043e\u0441\u043b\u0435 \u0448\u0430\u043f\u043a\u0438 \u0438 \u0433\u043e\u0440\u0438\u0437\u043e\u043d\u0442\u0430\u043b\u044c\u043d\u043e\u0433\u043e \u043c\u0435\u043d\u044e. \u0421\u043b\u0435\u0434\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u043d\u043e, \u0432\u0435\u0440\u0442\u0438\u043a\u0430\u043b\u044c\u043d\u043e\u0435 \u043c\u0435\u043d\u044e \u0434\u043e\u043b\u0436\u043d\u043e \u043f\u043b\u0430\u0432\u0430\u0442\u044c \u0442\u043e\u043b\u044c\u043a\u043e \u0442\u043e\u0433\u0434\u0430, \u043a\u043e\u0433\u0434\u0430 \u0435\u0433\u043e \u0432\u0435\u0440\u0445\u043d\u044f\u044f \u0433\u0440\u0430\u043d\u0438\u0446\u0430 \u0441\u043a\u0440\u044b\u0432\u0430\u0435\u0442\u0441\u044f \u0437\u0430 \u0432\u0435\u0440\u0445\u043d\u0438\u043c \u043a\u0440\u0430\u0435\u043c \u043e\u0431\u043b\u0430\u0441\u0442\u0438 \u043f\u0440\u043e\u0441\u043c\u043e\u0442\u0440\u0430 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0430.<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":[],"categories":[50],"tags":[57,83,53,84,98,96,43],"_links":{"self":[{"href":"https:\/\/hyperseo.ru\/index.php?rest_route=\/wp\/v2\/posts\/186"}],"collection":[{"href":"https:\/\/hyperseo.ru\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/hyperseo.ru\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/hyperseo.ru\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/hyperseo.ru\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=186"}],"version-history":[{"count":0,"href":"https:\/\/hyperseo.ru\/index.php?rest_route=\/wp\/v2\/posts\/186\/revisions"}],"wp:attachment":[{"href":"https:\/\/hyperseo.ru\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=186"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/hyperseo.ru\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=186"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/hyperseo.ru\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=186"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}