5

最新のSafari 8.0でBootstrapツールチップ（のみ）でこの奇妙なケースがあります。フォームがあり、各入力にツールチップを表示する必要があります (理由は聞かないでください)。

これがjsfiddleの例です

`http://jsfiddle.net/d61yuy8q/11/`

Safari 8.0 での表示は次のとおりです。

ここに画像の説明を入力

最初に、css が何らかの問題を引き起こす可能性があると考えたので、純粋なブートストラップ クラスに分解しました。次に、これらのツールチップを入力から、入力をラップしている div に移動する必要があるかもしれないと考えましたが、それも役に立ちませんでした。

最後に、すべてのラッパーを削除し、入力のみを残しましたが、それも役に立ちませんでした。

私の推測では、2 つの同じ要素の間にスペースがない場合、新しい Safari は mouseleave アクションを認識しないということです。

誰もがそのための回避策を考えることができますか?

4

2 に答える 2

1

私は個人的にブーストラップ ツールチップが好きではありません。ツールチップをポップオーバーに置き換えるカスタム スクリプトを作成しました。使用方法は次のとおりです。

<a href="#" title="This is link">Hello</a>

  $(function() {
      $('[title]').attr("data-rel", "tooltip");
      $("[data-rel='tooltip']")
          .attr("data-placement", "top")
          .attr("data-content", function() {
              return $(this).attr("title")
          })
          .removeAttr('title');


      var showPopover = function() {
          $(this).popover('show');
      };
      var hidePopover = function() {
          $(this).popover('hide');
      };
      $("[data-rel='tooltip']").popover({
          trigger: 'manual'
      }).click(showPopover).hover(showPopover, hidePopover);

  });
于 2014-11-18T12:51:22.843 に答える