Поддержка Проблемы и решения Табы которые сохраняют свое местоположение вкладок!

  • Решено a_sultanoff

    (@a_sultanoff)


    Здраствуйте форумчане! Сегодня возникла необходимость заключить в табы последние статьи и календарь чтобы он был невидим во вкладке но чтобы иногда был полезен пользователям!Но вот незадача! Когда пользователь открывает вкладку календарь и нажимает на дату или на месяц то страничка перезагружается и соответственно вкладка снова переходит на показ последних статей и если пользователь не нашел то что ему надо ему снова приходится нажимать на вкладку календарь и снова проделывать такую неудобную процедуру!Т.е вкладка не запоминается после перезагрузки! Скажите как или вообще есть табы которые запоминают свои открытые вкладки после перезагрузки сайта!?

Просмотр 15 ответов — с 1 по 15 (всего 18)
  • Автор a_sultanoff

    (@a_sultanoff)

    Весь инет обрал и нигде ни у кого вкладки табов после перезагрузки не запоминаются! Может есть какие надумки…Люди!

    Ссылку на сайт, где это реализовано, дайте..

    если вы делаете табы с помощью jQuery то для запоминания позиции табов надо подключить дополнительную библиотеку называется cookie,
    я подключаю все таким вот образом

    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>
    <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>
    <script src="http://view.jquery.com/trunk/plugins/cookie/jquery.cookie.min.js"></script>
    Автор a_sultanoff

    (@a_sultanoff)

    @wikicms так я говорю что ненащел!stur так у меня эти библиотеки уже давно подключены и одна вещичка наподобии табов уже работает нормально…даже две финтиклюшки…первая это при нажатии на иконку лист все статьи которые появляются на страничке archiv.php выстраиваются в строки вот так http://s57.radikal.ru/i156/1109/4e/49b0e411f292.jpg или наоборот в ряд вот так http://s39.radikal.ru/i085/1109/35/0e89cfdc2132.jpg и все сохраняется после перезагрузки….даже фонт ресайзер который я выдрал из темы и поставил себе тоже сохраняет настройки…а табы которые у меня построены вот так

    <div class="tabber">
    	<ul id="tabs" class="tabs">
    		<li class="one_tab"><a href="#recent-comments" rel="rec"  class="selected">Первый таб</a></li>
    		<li class="two_tab"><a href="#monthly-archives" rel="mon">Второй таб</a></li>
    	</ul>
    <div class="clear"></div>
    	<ul id="rec" class="tabcontent">
    		<strong>тут вывод одних новостей</strong>
    	</ul>
    	<ul id="mon" class="tabcontent">
    		<strong>тут вывод других новостей</strong>
    	</ul>
        <script type="text/javascript">
    	var tabs=new ddtabcontent("tabs")
    	tabs.setpersist(false)
    	tabs.setselectedClassTarget("link")
    	tabs.init()
    	</script>
    </div>

    и подключаю ajaxtabs.js…но позиции табов не запоминаются хотя в самом js что то про них в коде есть…я прост js не очень понимаю!

    библиотека куисов и сами табы подключается вот так

    <script>
      $(document).ready(function() {
        var cookie = $( "#tabs" ).tabs( "option", "cookie" );
        $( "#tabs" ).tabs( "option", "cookie", { expires: 30 } );
        $( "#tabs" ).tabs({ cookie: { expires: 30 } });
        $("#tabs").tabs();
      });
      </script>
    <div id="tabs" style="float:left">
    <ul>
            <li><a href="#fragment-1"><span>Недвижимость</span></a></li>
            <li><a href="#fragment-2"><span>Транспорт</span></a></li>
            <li><a href="#fragment-3"><span>Работа</span></a></li>
        </ul>
    
    <div id="fragment-1">
    Фрагмент 1
    </div>
    <div id="fragment-2">
    Фрагмент 2
    </div>
    <div id="fragment-3">
    Фрагмент 3
    </div>
    </div>

    Автор a_sultanoff

    (@a_sultanoff)

    stur Спасибо но мне это ни о чем не говорит! Этот код у меня не работает…у вас случаем нет сайта где это организовано и работает?

    Автор a_sultanoff

    (@a_sultanoff)

    У меня так же почти только у вас

    <script>
      $(document).ready(function() {
        var cookie = $( "#tabs" ).tabs( "option", "cookie" );
        $( "#tabs" ).tabs( "option", "cookie", { expires: 30 } );
        $( "#tabs" ).tabs({ cookie: { expires: 30 } });
        $("#tabs").tabs();
      });
      </script>

    а у меня

    <script type="text/javascript">
    	var tabs=new ddtabcontent("tabs")
    	tabs.setpersist(false)
    	tabs.setselectedClassTarget("link")
    	tabs.init()
    	</script>

    я прост незнаю…вы еще какие библиотеки Js подключаете чтобы работали табы?

    http://irent.com.ua/?s=

    библиотеки которые подключить я вам выше написал

    Автор a_sultanoff

    (@a_sultanoff)

    stur Скажите пожалуйста! Почему когда я делаю так как вы…табы не работают…я так понял эт вы мне теорию тут процетировали…в инете как создавать табы есть и почти все работают…но вот незадача есть те кто на англоязычных сайтах так же ищет решение моей проблемы и как не странно пока даже у них нет решения…либо народ знает и нехочет лишний раз поделиться решением либо никому такие табы ненужны вот они и не задумывались!

    странно я за час нашел все, что мне надо с примерами и установил не выходя за пределы сайта http://jquery.com/
    поверьте я ничего от вас не скрываю и рабочий пример я вам привел
    сокорей все го где-то ошибка. вы вообще уверены, что именно jQuery табы используете, что-то не похоже на них судя по вашему коду.

    Автор a_sultanoff

    (@a_sultanoff)

    Скажите пожалуйста! Вот этот вариант у меня работает превосходно…куки естественно не сохраняются…ну это и так понятно из кода…

    <!DOCTYPE html>
    <html>
    <head>
      <link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css" rel="stylesheet" type="text/css"/>
      <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>
      <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>
    
      <script>
      $(document).ready(function() {
        $("#tabs").tabs();
      });
      </script>
    </head>
    <body style="font-size:62.5%;">
    
    <div id="tabs">
        <ul>
            <li><a href="#fragment-1"><span>One</span></a></li>
            <li><a href="#fragment-2"><span>Two</span></a></li>
            <li><a href="#fragment-3"><span>Three</span></a></li>
        </ul>
        <div id="fragment-1">
            <p>First tab is active by default:</p>
            <pre><code>$('#example').tabs();</code></pre>
        </div>
        <div id="fragment-2">
            Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.
            Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.
        </div>
        <div id="fragment-3">
            Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.
            Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.
            Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.
        </div>
    </div>
    </body>
    </html>

    а тут http://docs.jquery.com/UI/API/1.8/Tabs внизу есть такие слова
    cookie
    Store the latest selected tab in a cookie. The cookie is then used to determine the initially selected tab if the selected option is not defined. Requires cookie plugin, which can also be found in the development-bundle>external folder from the download builder. The object needs to have key/value pairs of the form the cookie plugin expects as options. Available options (example): { expires: 7, path: ‘/’, domain: ‘jquery.com’, secure: true }. Since jQuery UI 1.7 it is also possible to define the cookie name being used via name property.

    Code examples
    Initialize a tabs with the cookie option specified.

    $( ".selector" ).tabs({ cookie: { expires: 30 } });

    Get or set the cookie option, after init.

    //getter
    var cookie = $( ".selector" ).tabs( "option", "cookie" );
    //setter
    $( ".selector" ).tabs( "option", "cookie", { expires: 30 } );

    Но прикрутить я так и не понял пока как…прост я уже писал выше что в джеквери непонимаю…щас учу его конечно…но если есть чем помочь…буду рад!

    ваш главный div элемент с табами id=»tabs» соответственно по правилам jquery доступ к нему можно будет получить
    $( «#tabs» )

    вас наверняка вводит в заблуждение то что id элемента соответствует методу обэкта $( «.selector» ).tabs у вас должно быть
    $( «#tabs» ).tabs

    Автор a_sultanoff

    (@a_sultanoff)

    stur Спасибо Вам за Вашу помощь…Буду тестить сегодня вечером!

    Автор a_sultanoff

    (@a_sultanoff)

    Ну блин все варианты уже перепробывал… и так пробывал

    <script>
      $(document).ready(function() {
        var cookie = $( "#tabs" ).tabs( "option", "cookie" );
        $( "#tabs" ).tabs( "option", "cookie", { expires: 30 } );
        $( "#tabs" ).tabs({ cookie: { expires: 30 } });
        $("#tabs").tabs();
      });
      </script>

    и так (вместо # точка)

    <script>
      $(document).ready(function() {
        var cookie = $( "#tabs" ).tabs( "option", "cookie" );
        $( ".tabs" ).tabs( "option", "cookie", { expires: 30 } );
        $( ".tabs" ).tabs({ cookie: { expires: 30 } });
        $(".tabs").tabs();
      });
      </script>

    и в первом врианте работает но не сохраняет позиции…все джеквери подключал…и с сайта джеквери новые скачал…во втором варианте нажимаю первый таб…и ничего не происходит…а после перезагрузки страницы нажатый до этого таб становится активным…кароче незнаю…может из-за того что сайт на локальном стоит…Если есть возможность скиньте мне пожалуйста на мыло ваши файлы где прописаны эти табы…наверно у вас это index и header.php Буду очень благодарен stur

    Автор a_sultanoff

    (@a_sultanoff)

    Забыл написать что мой емеил a_sultanoff собака mail.ru

Просмотр 15 ответов — с 1 по 15 (всего 18)
  • Тема «Табы которые сохраняют свое местоположение вкладок!» закрыта для новых ответов.