相关疑难解决方法(0)

我正在使用自定义jQuery 1.10.3主题.我从主题滚筒直接下载,我故意没有改变任何东西.

我创建了一个对话框,我得到一个空的灰色方块,其中关闭图标应为:

我比较了在我的页面上生成的代码:

<div class="ui-dialog-titlebar ui-widget-header ui-corner-all ui-helper-clearfix">
    <spanid="ui-id-2" class="ui-dialog-title">Title</span>
    <button class="ui-dialog-titlebar-close"></button>
</div>

在Dialog Demo页面上生成的代码:

<div class="ui-dialog-titlebar ui-widget-header ui-corner-all ui-helper-clearfix">
    <span id="ui-id-1" class="ui-dialog-title">Basic dialog</span>
    <button class="ui-button ui-widget ui-state-default ui-corner-all ui-button-icon-only ui-dialog-titlebar-close" role="button" aria-disabled="false" title="close">
        <span class="ui-button-icon-primary ui-icon ui-icon-closethick"></span>
        <span class="ui-button-text">close</span>
    </button>
</div>

编辑:代码的不同部分是由jQueryUI 生成的,而不是我,所以我不能只是添加span标签而不编辑jqueryui js文件,这似乎是一个糟糕/不必要的选择,以实现正常的功能.

以下是用于生成代码部分的javascript:

this.element.dialog({
    appendTo: "#summary_container",
    title: this.title(),
    closeText: "Close",
    width: this.width,
    position: {
        my: "center top",
        at: ("center top+"+(window.innerHeight*.1)),
        collision: "none"
    },
    modal: false,
    resizable: false,
    draggable: false,
    show: "fold",
    hide: "fold", …

我有一个<ul>列表,我想进行排序(拖放).如何在现代浏览器和触摸设备中使用Bootstrap 3？

我正在尝试使用jqueryui-sortable与http://touchpunch.furf.com/结合使用; 它似乎工作,但它是hacky和jQueryUI不能很好地与Bootstrap.

如何在添加触摸屏支持时避免Bootstrap/jQueryUI冲突？

我正在尝试使用tootltips

.tooltip-inner{}

但我有麻烦因为我找不到如何设计工具提示小箭头.

如屏幕截图所示,工具提示的箭头为黑色,我想在其上添加新颜色:

有什么建议吗？

我试图tooltip在一个引用jQueryUI和Bootstrap 3的View 上使用.我在这里做了一个样本.如果我在jQueryUI的js之后加载Boostrap然后tooltip()调用成功但是如果我在Bootstrap之后调用jQueryUI然后我得到一个错误并且没有任何作用.你可以自己尝试一下.互联网上有很多关于此的讨论,我问GitHub,但我还没找到解决方案.

我的页面上有一个默认的JQuery UI工具提示函数调用.有没有办法使用Inspector以交互方式设置工具提示div的样式？如果我有两个鼠标指针,一个将悬停在一个元素上以保持工具提示显示,第二个将使用Inspector并构建样式.但我只有一只鼠标,一旦它移出元素,工具提示就会消失.检查Inspector中的":hover"状态没有帮助.鼠标移出时工具提示消失.

我正在使用Chrome,但任何浏览器中的任何技巧都可以.

我是Bootsrap的新手,我刚刚开始了解它.我正在尝试使用工具提示javascript实用程序,我已经完成了所有应该根据网页,我看到的源代码和我在这里找到的一些答案,但它无法正常工作.

这是我打算在HTML中使用它的地方:

<!-- Hola mundo -->
<div class="row">
  <div class="starter-template tab-content">
    <div class="tab-pane fade in active tooltip-demo" id="home">
      <h1>¡Hola, mundo!</h1>
      <p class="lead">Nunc sit amet nunc dui. <a href="#" data-toggle="tooltip" data-original-title="Pista 1">Aliquam</a> nec viverra mi, et pellentesque sem. In dapibus sem ut consectetur dignissim. </p>
    </div>
    <!-- /div#home -->
  </div>
  <!-- /div.starter-template -->
</div>
<!-- /div.row -->

由于需要手动加载实用程序,这就是我所做的:

<script>
  $(document).ready(function (){
    $('.tooltip-demo').tooltip({
      selector: "[data-toggle=tooltip]",
      container: "body"
    })
  });

在加载jQuery之后,此脚本将加载到页面的页脚.

我已经定义了一个像这样的JQfactory插件

(function($, window, document) {
    $.jqfactory('my.tooltip', {

      /* My tooltip code */         

    }, false);
}(jQuery, window, document));

现在假设我在我的页面中也包含了Bootstrap框架,我想只调用我的版本tooltip(),而不是bootstrap版本.如何使用命名空间$.my.tooltip？

我有一个奇怪的情况，其中包含 jQuery UI 1.12.1 会破坏我的 Bootstrap 4.3.0 工具提示。

请参阅下文：此工具提示

<i class="fas fa-question-circle" rel="tooltip" data-placement="right" 
   data-original-title="My tooltip"></i>

与初始化$("[rel=tooltip]").tooltip({html:true});

无需包含 jQuery UI 1.12.1 即可工作，但会中断。

注意控制台上没有错误。tooltip() 正在成功执行，没有任何问题。

注释掉 jQuery UI 1.12.1 包含内容并亲自查看！

<i class="fas fa-question-circle" rel="tooltip" data-placement="right" 
   data-original-title="My tooltip"></i>

$("[rel=tooltip]").tooltip({html:true});

.fa-question-circle:before {
    content: "\f059";
}

或者，以下小提琴：最初不起作用，但删除jQuery UI 1.12.1 include，它将开始工作： https: //jsfiddle.net/21v4zh3u/