запомнить позицию
Здравствуйте, уважаемые!
У меня есть прокручиваемый список на javascript(картинки прокручиваются) довольно-таки длинный... при клике на картинку страница перезагружается и на странице выводиться новый контент с этой картинкой... трабл в том, что если прокрутить этот список довольно далеко(а он длинный), то при перезагрузке страницы список возвращается в первоначальное состояние, те если захочешь посмотреть след картинку, тебе придется прокручивать этот список еще тучу времени... так вот... как сделать так, чтобы этот список, при клике на картинку оставался в том же положении? Похожий пример тут http://www.4thorder.us/Scripts/Scrip...iewerBLACK.htm , и тут http://www.proklondike.com/contentview.php?content=323 вот код: <div class="spbox"> <img src="/images/left_arrow.gif" style="position: absolute; left: 0; top: 35px; cursor: pointer;" id="prew" onmousedown="ScrollLeft()" onmouseup="stopscroll()" onmouseout="stopscroll()"> <img src="/images/right_arrow.gif" style="position: absolute; right: 0; top: 35px; cursor: pointer;" id="next" onmousedown="ScrollRight()" onmouseup="stopscroll()" onmouseout="stopscroll()"> <div class="spbox_body" id="panorama"> <ul class="lenta" id="lenta"> {foreach from=$products item=item key=id} <li> <a href="/auto/?id_car={$id}&id_categor={$item.id_categor}&special=1"> <img src="/images/catalog/medium/{if $item.foto1}{$item.foto1}{else}nofoto2.jpg{/if}" width="146" height="94" class=""> {*<span class="sp_model">{$item.model}</span>*} <span class="sp_model">{$item.main_marka}</span> <span class="sp_date">{$item.year} г.</span> <span class="sp_count">{$item.cost} р.</span> <span class="sp_run">{$item.run} км</span> </a> </li> {/foreach} </ul> </div> </div> {literal} <script type="text/javascript"> var Timer; $("#panorama").ready(function(){ $("ul.lenta li:first").css("margin-left","0") var lg = $("ul.lenta li").length; var elwidth = $("ul.lenta li").css("width"); elwidth = elwidth.substring(0, elwidth.length-2); var w = (elwidth)*lg+10*lg-10; $("ul.lenta").css("width",w+"px"); checkscroll(); }); function ScrollLeft(){ Timer = setInterval("document.getElementById('panorama').scrollLeft -= 3", 5); } function ScrollRight(){ Timer = setInterval("document.getElementById('panorama').scrollLeft += 3", 5); } function stopscroll(){ clearInterval(Timer); checkscroll(); } function checkscroll(){ var lenta = document.getElementById('lenta').offsetWidth; var spb = document.getElementById('panorama').offsetWidth; var sc = document.getElementById('panorama').scrollLeft; if($.browser.opera){lenta = lenta+46} if ((lenta-spb)==sc) $("#next").addClass("opacity") else $("#next").removeClass("opacity") if ((sc)==0) $("#prew").addClass("opacity") else $("#prew").removeClass("opacity") //alert(sc+" : "+(lenta-spb)); } </script> {/literal} Помогите пожалуйста! Заранее спасибо!=) |
понял, надо с куками работать... Теперь возник вопрос как это правильно сделать?
Я так понимаю надо запомнить в куках ScrollLeft () а потом считать его и дописать в конец ссылки? |
можно по идее только номер элемента запоминать.
А потом, взяв из куки этот номер, производить все вычисления и перематывать на него (если картинки по размеру одинаковые, например). А можно и число пикселей. Только не забудте при загрузки страницы сделать проверку на наличие кук и выполнить соответствующее действие. В общем Вы все сами и написали =) |
что-то ничего не получается...
сделал 2 функции: function setCookie (szName, szValue) { document.cookie = szName + "=" + szValue + "; } и function getCookie (szName) { var i = 0; var nStartPosition = 0; var nEndPosition = 0; var szCookieString = document.cookie; while(i <= szCookieString.length) { nStartPosition = i; nEndPosition = nStartPosition + szName.length; if(szCookieString.substring( nStartPosition,nEndPosition) == szName) { nStartPosition = nEndPosition + 1; nEndPosition = document.cookie.indexOf(";",nStartPosition); if(nEndPosition < nStartPosition) nEndPosition = document.cookie.length; return document.cookie.substring( nStartPosition,nEndPosition); break; } i++; } return ""; alert(getCookie(ScrollLeft)); } что с ними теперь делать - не пойму!=( |
Часовой пояс GMT +3, время: 12:10. |