Перейти к публикации
Дизайн и модификация IPS Community IPBSkinsBETA
Поиск в
  • Дополнительно...
Искать результаты, содержащие...
Искать результаты в...
Qartvela™

Стандартный всплывающий окно

Рекомендованные сообщения

<li class="left"><a href='#' id='rimShowPopup'>Live</a></li>
<div id='rimPopup' style='display:none;'>
       <h3 style="cursor:move">Live ...</h3>
<iframe frameborder="0" width="800" height="450" src="..."></iframe>
</div>
<script type='text/javascript'>
//<![CDATA[
showPopup = function(e) {
       Event.stop(e);
       popup = new ipb.Popup( 'rimPopup', { type: 'pane', modal: false, w: '800px', h: '450px', initial: $('rimPopup').innerHTML, hideAtStart: false, close: 'a[rel="close"]' } );
       return false;
}
if( $('rimShowPopup') ) {
       $('rimShowPopup').observe('click', showPopup);
}
//]]>
</script>

 

Нужно добавить функцию "draggable" без jQuery. как можно реализовать?

Поделиться сообщением


Ссылка на сообщение

<li class="left"><a href='#' id='rimShowPopup'>Live</a></li>

<div id='rimPopup' style='display:none;'>
       <h3 style="cursor:move">Live ...</h3>
<iframe frameborder="0" width="800" height="450" src="..."></iframe>
</div>

<script type='text/javascript'>
//<![CDATA[
showPopup = function(e) {
       Event.stop(e);
       popup = new ipb.Popup( 'rimPopup', { type: 'pane', modal: false, w: '800px', h: '450px', initial: $('rimPopup').innerHTML, hideAtStart: false, classname: 'draggable', close: 'a[rel="close"]' } );
       return false;
}
if( $('rimShowPopup') ) {
       $('rimShowPopup').observe('click', showPopup);
}
//]]>
</script>

<script type='text/javascript'>
(function (document) {
   'use strict';
   function startDrag(evt) {
       var diffX = evt.clientX - this.offsetLeft,
           diffY = evt.clientY - this.offsetTop,
           that = this; 
       function moveAlong(evt) {
           that.style.left = (evt.clientX - diffX) + 'px';
           that.style.top = (evt.clientY - diffY) + 'px';
       }
       function stopDrag() {
document.removeEventListener('mousemove', moveAlong);
document.removeEventListener('mouseup', stopDrag);
       }
document.addEventListener('mouseup', stopDrag);
document.addEventListener('mousemove', moveAlong);
   }
   function startDragIfDraggable(evt) {
       if (evt.target.classList.contains('draggable')) {
    startDrag.call(evt.target, evt);
       }
   }
document.body.addEventListener('mousedown', startDragIfDraggable);
}
(document));
</script>

 

но остался один проблема, когда перемещаешь эту "DIV id='rimPopup'" над текстом, начинается выделение текста.

Поделиться сообщением


Ссылка на сообщение

Создайте аккаунт или войдите в него для комментирования

Вы должны быть пользователем, чтобы оставить комментарий

Создать аккаунт

Зарегистрируйтесь для получения аккаунта. Это просто!

Зарегистрировать аккаунт

Войти

Уже зарегистрированы? Войдите здесь.

Войти сейчас

  • Сейчас на странице   0 пользователей

    Нет пользователей, просматривающих эту страницу.

×
×
  • Создать...