Страница 4 из 4 « Первая < 23 4
Показывать 40 сообщений этой темы на одной странице

Javascript-форум (https://javascript.ru/forum/)
-   jQuery (https://javascript.ru/forum/jquery/)
-   -   Помогите разобраться с mouseenter / mouseleave и setTimeout (https://javascript.ru/forum/jquery/63330-pomogite-razobratsya-s-mouseenter-mouseleave-i-settimeout.html)

рони 30.06.2016 00:41
Цитата:
Сообщение от alecto
то есть из поста с кодом нужно обновить скрипт?
нет если вы взяли уже из 26 поста, то обновлять ненужно.

alecto 30.06.2016 08:05
еще обнаружил: сайдбары сайта складываются при уменьшении размера окна, т.е. надо менять офссет таким образом, чтобы плавающий блок никогда не выходил за границы окна, когда нет правостороннего сайдбара.

пришлось два раза добавить код коррекции офсета:
var tempXOffset = 0;
                    if ($(window).width() > (e.pageX + 305 + options.xOffset) ) tempXOffset = 0; else tempXOffset = -300 - options.xOffset;


1
$("body").append("<div id='" + options.tooltipId + "'>" + content + "</div>");
                    var tempXOffset = 0;
                    if ($(window).width() > (e.pageX + 305 + options.xOffset) ) tempXOffset = 0; else tempXOffset = -300 - options.xOffset;
                    $("#" + options.tooltipId)
                    .css({"position": "absolute",
                          "top": e.pageY - options.yOffset + "px",
                          "left": e.pageX + options.xOffset + tempXOffset + "px",
                          "display": "none"}).delay(options.pause).fadeIn("fast")


2
$(this).mousemove(function (e) {
                var tempXOffset = 0;
                if ($(window).width() > (e.pageX + 305 + options.xOffset) ) tempXOffset = 0; else tempXOffset = -300 - options.xOffset;
                $("#" + options.tooltipId).css({"top": e.pageY - options.yOffset + "px",


или есть смысл, чтобы облегчить вычисления скрипта, поставить статичные цифры в условие?


UPD: с описанием вроде разобрался.

в примере плагин подключается отдельным скриптом, думаю, не будет ошибкой, что я его код втянул в свой скрипт и подключил в условии, чтобы он работал только на главной странице?

рони 30.06.2016 12:53
tooltip в видимой части окна
 
alecto,
:write: :) 
<!DOCTYPE html>

<html>
<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <base href="http://astravel.com.ua/" />
  <link rel="stylesheet" type="text/css" href="http://astravel.com.ua/core/assets/vendor/normalize-css/normalize.css">

  <link rel="stylesheet" type="text/css" href="http://astravel.com.ua/themes/astravel/css/bootstrap.css">
  <link rel="stylesheet" type="text/css" href="http://astravel.com.ua/themes/astravel/css/custom.css">
  <link rel="stylesheet" type="text/css" href="http://astravel.com.ua/themes/astravel/css/base/elements.css">
  <link rel="stylesheet" type="text/css" href="http://astravel.com.ua/sites/default/files/color/astravel-02d29967/colors.css">
  <link rel="stylesheet" type="text/css" href="http://astravel.com.ua/core/themes/stable/css/views/views.module.css">
  <style type="text/css">
    #block-astravel-content {
      width: 700px;
      margin: 0 auto;
    }
     #follower{
        border: 3px rgb(255, 255, 255) solid;
        border-radius: 8px;
      }

 </style>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>

  <script>
jQuery.fn.center = function(event) {
    var w = $(window),
        top = w.height() - this.outerHeight(true) + w.scrollTop() - (event.pageY + 22),
        left = w.width() - this.outerWidth(true) + w.scrollLeft() - (event.pageX + 7);
    this.css("position", "absolute");
    top = top > 0 ? event.pageY + 22 : event.pageY - this.outerHeight(true);
    top < w.scrollTop() && (top = w.scrollTop());
    left = left > 0 ? event.pageX + 7 : event.pageX - this.outerWidth(true);
    left < w.scrollLeft() && (left = w.scrollLeft() + 4);
    this.css("top", top + "px");
    this.css("left", left + "px");
    return this
};
$(function() {
    var tooltip = $("<div>", {
        id: "follower"
    }).appendTo("body");
    $(".view-tury.view-display-id-page_1 .views-col").mousemove(function(event) {
        tooltip.center(event)
    }).mouseenter(function(event) {
        tooltip.html($(this).html()).stop(true, true).delay(800).fadeIn()
    }).add(tooltip).mouseleave(function() {
        tooltip.stop(true, true).delay(500).fadeOut()
    });
    tooltip.mouseenter(function(event) {
        tooltip.stop(true, true)
    })
});
  </script>
</head>

<body>
 <p style=" height: 1000px"></p>
    <div id="block-astravel-page-title" class="block block-core block-page-title-block">


      <div class="content">

  <h1 class="js-quickedit-page-title title page-title">Горящие туры и специальные предложения</h1>


    </div>
  </div>
<div id="block-astravel-content" class="block block-system block-system-main-block">


      <div class="content">
      <div class="views-element-container"><div class="view view-tury view-id-tury view-display-id-page_1 js-view-dom-id-778dd42ea816542b94de8810880c3ca3a8c259c3a185b752139401331a77005e">



      <div class="view-content">
          <div class="views-view-grid horizontal cols-3 clearfix">
            <div class="views-row clearfix row-1">
                  <div title="" class="views-col col-1" style="width: 33.333333333333%;">
            <div class="views-field views-field-field-image"><div class="field-content">  <a href="/tours/207"><img src="/sites/default/files/styles/tury_glavnaa_stranica_200_h_120/public/images/tours/chernogoria.jpg?itok=MZJ3nIBO" alt="" typeof="foaf:Image" class="image-style-tury-glavnaa-stranica-200-h-120" height="141" width="238">

</a>
</div></div><div class="views-field views-field-title"><span class="field-content"><a href="/tours/207" hreflang="ru">Черногория из Харькова. Горящий!</a></span></div><div class="views-field views-field-field-spisok-dat"><span class="views-label views-label-field-spisok-dat">Даты: </span><div class="field-content">03.07.2016 и далее по воскресеньям</div></div><div class="views-field views-field-field-dlitelnost-tura"><span class="views-label views-label-field-dlitelnost-tura">Длительность: </span><div class="field-content">7 ночей / 8 дней</div></div><div class="views-field views-field-field-stoimost-tura"><span class="views-label views-label-field-stoimost-tura">Стоимость: </span><div class="field-content">от 262</div></div><div class="views-field views-field-field-valuta"><div class="field-content">€</div></div>
          </div>
                  <div class="views-col col-2" style="width: 33.333333333333%;">
            <div class="views-field views-field-field-image"><div class="field-content">  <a href="/tours/153"><img src="/sites/default/files/styles/tury_glavnaa_stranica_200_h_120/public/images/tours/at-oludeniz-1.jpg?itok=r9z2C4fM" alt="" typeof="foaf:Image" class="image-style-tury-glavnaa-stranica-200-h-120" height="141" width="238">

</a>
</div></div><div class="views-field views-field-title"><span class="field-content"><a href="/tours/153" hreflang="ru">Новинка! Отдых на Эгейском побережье Турции с вылетом из Харькова!</a></span></div><div class="views-field views-field-field-spisok-dat"><span class="views-label views-label-field-spisok-dat">Даты: </span><div class="field-content">30.06, 04.07, 14.07, 25.07, 04.08, 15.08, 25.08, 05.09, 15.09, 26.09, 06.10, 17.10.2016</div></div><div class="views-field views-field-field-dlitelnost-tura"><span class="views-label views-label-field-dlitelnost-tura">Длительность: </span><div class="field-content">12 дней / 11 ночей, 11 дней / 10 ночей</div></div><div class="views-field views-field-field-stoimost-tura"><span class="views-label views-label-field-stoimost-tura">Стоимость: </span><div class="field-content">от 406</div></div><div class="views-field views-field-field-valuta"><div class="field-content">$</div></div>
          </div>
                  <div class="views-col col-3" style="width: 33.333333333333%;">
            <div class="views-field views-field-field-image"><div class="field-content">  <a href="/tours/242"><img src="/sites/default/files/styles/tury_glavnaa_stranica_200_h_120/public/images/tours/qcycnw4y.jpg?itok=uyXyWU4U" alt="" typeof="foaf:Image" class="image-style-tury-glavnaa-stranica-200-h-120" height="141" width="238">

</a>
</div></div><div class="views-field views-field-title"><span class="field-content"><a href="/tours/242" hreflang="ru">Отель Kaya Palazzo Golf Resort 5* Deluxe - роскошь и великолепие на берегу Средиземного моря Турции!</a></span></div><div class="views-field views-field-field-spisok-dat"><span class="views-label views-label-field-spisok-dat">Даты: </span><div class="field-content">лето 2016</div></div><div class="views-field views-field-field-dlitelnost-tura"><span class="views-label views-label-field-dlitelnost-tura">Длительность: </span><div class="field-content">от 7 ночей / 8 дней</div></div><div class="views-field views-field-field-stoimost-tura"><span class="views-label views-label-field-stoimost-tura">Стоимость: </span><div class="field-content">от 899</div></div><div class="views-field views-field-field-valuta"><div class="field-content">$</div></div>
          </div>
              </div>



      </div>

    </div><div class="more-link"><a href="/tours/hot">Смотреть все горящие туры</a></div>

          </div>
</div>

    </div>
  </div>


<p style=" height: 1000px"></p>

</body>
</html>

alecto 30.06.2016 15:42
Рони, просто нет слов! последний плагин - бомба!!!


Часовой пояс GMT +3, время: 10:49.
Страница 4 из 4 « Первая < 23 4
Показывать 40 сообщений этой темы на одной странице