0 / 0 / 0
Регистрация: 21.01.2016
Сообщений: 32
1

Спойлер в виде картинки с интерактивной картой внутри

16.06.2016, 02:22. Показов 2382. Ответов 4
Метки нет (Все метки)

Author24 — интернет-сервис помощи студентам
Всем доброго времени суток.
Помогите пожалуйста сделать споллер в виде картинки, который при нажатии на картинку, спрячит картинку и откроет интерактивную карту. Пожалуйста помогите очень нужно
0
Programming
Эксперт
94731 / 64177 / 26122
Регистрация: 12.04.2006
Сообщений: 116,782
16.06.2016, 02:22
Ответы с готовыми решениями:

Создание приложения с интерактивной картой
Здравствуйте, уважаемые программисты, прошу Вас немного проконсультировать меня. Хочу написать...

Создание интерактивной картинки SVG
Добрый день, я в JS новичок, и вот столкнулся с такой задачей: требуется сделать интерактивную...

Спойлер картинки в ворде
Всем привет. Ребята научился делать спойлер текста вот таким кодом Private Sub...

Спойлер под картинки с выпадающими таблицами
Ситуация такая. Два ряда картинок по 4 в каждом. Под каждой в спойлере скрыта таблица со...

4
Богатый духовно
455 / 262 / 145
Регистрация: 10.03.2015
Сообщений: 1,057
16.06.2016, 12:23 2
Meowizzy,
HTML5
1
2
3
4
5
6
<div class="statik box">
картинка карты
</div>
<div class="interactiv box hide">
  интеркативаня карта
</div>
CSS
1
2
3
4
5
6
7
8
9
10
11
12
13
14
.box{
  width:200px;
  height:200px;
}
.statik{
   background: blue;
   cursor:pointer;
}
.interactiv{
  background:green;
  }
 .hide{
    display:none;
  }
Jquery
Javascript
1
2
3
4
5
6
7
8
$('.statik').click(function(){
                    $(this).addClass("hide");
          $(".interactiv").removeClass("hide")
});
$('.interactiv').click(function(){
                    $(this).addClass("hide");
          $(".statik").removeClass("hide")
});
Добавлено через 5 минут
https://jsfiddle.net/boilzzz/gy9cgf9w/1/
0
Эксперт HTML/CSS
2964 / 2598 / 1068
Регистрация: 15.12.2012
Сообщений: 9,874
Записей в блоге: 11
16.06.2016, 12:39 3
Meowizzy, ссылка, если Вас заинтересует версия спойлера на css...
0
0 / 0 / 0
Регистрация: 21.01.2016
Сообщений: 32
16.06.2016, 19:52  [ТС] 4
не работает

HTML5
1
2
3
4
5
6
7
8
9
10
11
<div class="statik box">
<img src="https://www.cyberforum.ru/images/map.jpg" alt="Карта" /> 
</div>
 
<div class="interactiv box hide">
<script type="text/javascript" charset="utf-8" async src="https://api-maps.yandex.ru/services/constructor/1.0/js/?sid=eaMAhvgOGcgJAoPENDgL49fOUyuKH3e4&width=500&height=400&lang=ru_RU&sourceType=constructor&scroll=true"></script> -->
   <div class="container-fluid">   
        <div class="row">
            <div class="col-md-12 footer"> 
            
</div>
0
Богатый духовно
455 / 262 / 145
Регистрация: 10.03.2015
Сообщений: 1,057
16.06.2016, 20:47 5
Meowizzy, Jquery библеотека подключена?

Добавлено через 2 минуты
вот смотрите все работает

Добавлено через 24 секунды
https://jsfiddle.net/boilzzz/169bzneq/
0
16.06.2016, 20:47
IT_Exp
Эксперт
87844 / 49110 / 22898
Регистрация: 17.06.2006
Сообщений: 92,604
16.06.2016, 20:47
Помогаю со студенческими работами здесь

Текстовый редактор спойлер для картинки
Подскажите текстовый редактор в котором картинку в тексте можно прятать в спойлер.

Как задать положение картинки внутри другой картинки? CSS, HTML
Добрый день. Начинаю учить веб-разработку и решил написать простенький сайт. В общем, нужно...

Размещение картинки внутри картинки
Здравствуйте. Я не могу понять почему у меня накладывающаяся картинка притягивается к верху(...

Обводка внутри картинки
Подскажите как сделать через CSS или HTML обводку внутри картинки с осветлением? вот так -


Искать еще темы с ответами

Или воспользуйтесь поиском по форуму:
5
Ответ Создать тему
Опции темы

КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin
Copyright ©2000 - 2024, CyberForum.ru