Форум

ДмитРок123 · #1 (**permalink**) 20.06.2016, 21:50

как можно реализовать вызов div блока при переходе по ссылке.

например:
я перейду на определенную страницу:

<a href="/files" id="#boses">переход</a>

после перехода на страницу вылезет блок.

<div id="boxes">текст</div>

есть скрипт блока который появляется по клику на этой странице:

<script>
$(document).ready(function() { 
 $('a[name=dow]').click(function(e) {
 e.preventDefault();
 var id = $(this).attr('href');
 var maskHeight = $(document).height();
 var maskWidth = $(window).width();
 $('#mask').fadeIn(1000); 
 $('#mask').fadeTo("slow",0.8); 
 var winH = $(window).height();
 var winW = $(window).width();
 $(id).css('top', winH/2-$(id).height()/2);
 $(id).css('left', winW/2-$(id).width()/2);
 $(id).fadeIn(1000); 
 });
 $('.window .close').click(function (e) { 
 e.preventDefault();
 $('#mask, .window').hide();
 }); 
 $('#mask').click(function () {
 $(this).hide();
 $('.window').hide();
 }); 
 }); 
</script>

и сама кнопка:

<a href="#dow" name="dow">клик</a>

Rasy · #2 (**permalink**) 20.06.2016, 22:17

Сообщение от ДмитРок123

после перехода на страницу вылезет блок.

Откуда вылезет?

ДмитРок123 · #3 (**permalink**) 20.06.2016, 22:22

Сообщение от Rasy

Откуда вылезет?

ну по клику появляется

Rasy · #4 (**permalink**) 20.06.2016, 23:12

<head>
  <meta charset="UTF-8">
  <title>test</title>
  <script src="http://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
</head>
<body>

<style>
  .is-hidden {
    display: none;
  }
</style>

  <script>

    $(function () {
      if (localStorage.getItem('transit') !== null) {
          var target = localStorage.getItem('transit');
          $('#'+target).toggleClass('is-hidden');
          localStorage.clear();
      }

      $('.target-link').on('click', function(e) {
        var target = $(this).attr('href').split('#'),
            target = target[target.length-1];

        if (localStorage.getItem('transit', target) === null) {
            localStorage.setItem('transit', target);
        }
        $('#'+target).toggleClass('is-hidden');
      });
    });

  </script>
  <a href="2.html#boxes" class="target-link">Click</a>
  <div id="boxes" class="is-hidden">Lorem ipsum</div>

</body>

Форум

Справочник

Discord чат

Курсы javascript