标签: tooltip

我有一个Windows Forms C#应用程序,我想在其中一个文本框上使用工具提示.我在Form类的构造函数中初始化工具提示,它第一次工作.因此,当我用鼠标将鼠标悬停在文本框上时,它可以工作,但是一旦工具提示超时并且它消失,当我将鼠标移开并返回到控件上时,它不会重新出现.我希望它会回来.我究竟做错了什么？

以下是我初始化工具提示的方法:

myTip = new ToolTip();
myTip.ToolTipIcon = ToolTipIcon.Info;
myTip.IsBalloon = true;
myTip.ShowAlways = true;

myTip.SetToolTip(txtMyTextBox,"My Tooltip Text");

我在一个有限大小的控件中有一个TextBlock.如果文本太长而无法放入控件中,我想显示带有全文的工具提示.这是您从许多应用程序中肯定知道的经典行为.

我尝试使用Converter将TextBlock宽度转换为Tooltip的Visibility.

<GridViewColumn.CellTemplate>
    <DataTemplate>
        <TextBlock Text="{Binding Text}">
            <TextBlock.ToolTip>
                <ToolTip 
                    DataContext="{TemplateBinding Content}" 
                    Visibility="{Binding Converter={StaticResource visConvert}}">

                        <TextBlock Text="{Binding Text}"></TextBlock>
                </ToolTip>
            </TextBlock.ToolTip>
        </TextBlock>
    </DataTemplate>
</GridViewColumn.CellTemplate>

问题是在转换器中:

public object Convert(object value, ...

'value'是DataBound项.我希望'value'成为TextBlock,观察它的宽度,并将它与GridViewColumn.Width进行比较.

我onmouseover在javascript中玩这个事件

我想要一个小盒子弹出并保持不动,直到没有onmouseover了

我认为它被称为描述框,但我不确定.

当我将鼠标放在某些文本上时,如何使用自定义文本弹出一个小框,并在将鼠标移动到另一个对象后消失.

我需要在工具提示上显示3个值:时间,值和另一个值(更改).

我看到了这个例子(但是jsdfiddle没有用).

我试过这个

//each loop..
indice.push(["time", "value1", "value2"]);

,工具提示设置

tooltip:
    {
    useHTML: true,
    formatter: function()
    {
      return '' + Highcharts.dateFormat('%H:%M:%S', this.x) +'; '+ this.y + this.z(<-is this right?);
    }
},

和系列

series:
[{
    type: 'area',
    data: indice
}]

可以帮忙吗？thsnks.

我正在使用Twitter Bootstrap提供的工具提示(http://twitter.github.com/bootstrap/javascript.html#tooltips).

我的DOM中有一些动态插入的标记需要触发工具提示.这就是我以下列方式触发工具提示的原因(https://github.com/twitter/bootstrap/issues/4215):

$('body').tooltip({
    delay: { show: 300, hide: 0 },
    selector: '[rel=tooltip]:not([disabled])'
});

为了避免工具提示放置得太靠近屏幕边缘,我需要能够根据触发工具提示的元素的位置动态设置它们的位置.我想到了以下方式:

   $('body').tooltip({
        delay: { show: 300, hide: 0 },
        // here comes the problem...
        placement: positionTooltip(this),
        selector: '[rel=tooltip]:not([disabled])'
    });



function positionTooltip(currentElement) {
     var position = $(currentElement).position();

     if (position.left > 515) {
            return "left";
        }

        if (position.left < 515) {
            return "right";
        }

        if (position.top < 110){
            return "bottom";
        }

     return "top";
}

如何将currentElement正确传递给positionTooltip函数,以便为每个工具提示返回适当的放置值？

提前致谢

我有一个仅限CSS的工具提示,span当你hover链接时它会加载一个工具提示.然而,这是使用CSS定位的,但如果链接靠近页面顶部或侧面,则工具提示会从页面的侧面/顶部移开.

是否有一种方法可以使用css进行此更改,还是我必须依赖JS？我已经开始尝试将一些东西与jQuery放在一起但是如果可能的话宁愿使用CSS.

JS小提琴在https://jsfiddle.net/gtoprh21/12/

片段:

$( ".ktooltip" )
.mouseover(function(e) {
   var mousex = e.pageX + 20; //Get X coordinates
   var mousey = e.pageY + 10; //Get Y coordinates
   if((mousey+100)>$(window).height())
   {

    $('.tooltip')
    .css({ top: mousey-100 ,left: mousex })

   }
   else if((mousex+200)>$(window).width())
   {
      $('.tooltip')
    .css({ top: mousey ,left: mousex-200})

   }
   else
    {
   $('.tooltip')
    .css({ top: mousey, left: mousex })

    }
})

.ref, .refs {
  position:relative;
}
/*added a text indent to overide indent styles further down*/
.ktooltip { …

好的,我是一个完全的初学者,并设法在C#中组合一个小应用程序,我在文本框中输入用户名,应用程序获取该用户名的头像并将其显示在图片框中.

我想要做的是让工具提示显示鼠标悬停在加载的头像上时在文本框中键入的用户名.它应该在每次加载新头像时更改.我知道如何以正常方式使用工具提示,但这对我来说有点复杂.任何帮助将不胜感激.

谢谢.

使用上下文工具提示快速浏览webapp的最佳方法是什么？

使用案例:

• 用户导航到webapp
• 某种形式的弹出窗口询问用户是否需要导览参观界面
• 用户可以在每个工具提示上单击下一步以显示下一个工具提示
• 用户可以通过单击某种退出X或按钮随时取消巡视

那里有一个简单的图书馆吗？

谢谢!

我试图使用我从以下发现的.tooltip():Jquery-ui工具提示.我所拥有的是一个在桌面上有一些信息的rails应用程序.在单独的细胞中.目前,您可以通过单击它来查看单元格的完整信息,这将打开jquery对话框,该对话框工作正常.我想要添加到它是为了有两个选项.

• 1)单击调出jquery对话框的单元格 - 已经有效

• 2)或悬停显示概述的单元格.

图片

从图像目前您可以点击预订,它将显示预订信息.但是我试图扩展它,以便用户可以选择单击以查看信息或将鼠标悬停在单元格上以查看信息.

做这个的最好方式是什么？我有以下代码可以使用并启动对话框.我尝试添加:

<td class="<%= booking.status %>" onmouseover='$("#booking<%= booking.id %>").tooltip()'>

在此之前不起作用,我可能理解它不会起作用,因为两者之间会发生冲突.除此之外,我确实尝试使用simpletip和qtip,但似乎没有运气.是我试图做的不可行.

<td class="<%= booking.status %>" onclick='$("#booking<%= booking.id %>").dialog()'>
  <center>
  <%= booking.reference_number %>
  <% if current_user.is_booking_manager? %>
    (<%= booking.company_name %>)
  <% end %>
</center>
<div style="display:none;">
  <% if not booking.provisional? or current_user.is_booking_manager? %>
    <div id="booking<%= booking.id %>" title="Booking Information">
  <% else %>
    <div id="booking<%= booking.id %>" title="Edit Booking">
  <% end %>
      <%= render :partial => "booking_dialog", :locals => { :booking => booking } %> …

我正在尝试重新设置/重新格式化Bootstrap 4中的工具提示,而原始的方式似乎不再起作用了.目前我这样做:

.tooltip-inner {
    background: #7abcff; 
    background: -webkit-linear-gradient(top, #7abcff 0%,#60abf8 44%,#4096ee 100%); 
    background:    -moz-linear-gradient(top, #7abcff 0%,#60abf8 44%,#4096ee 100%); 
    background:   linear-gradient(to bottom, #7abcff 0%,#60abf8 44%,#4096ee 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#7abcff', endColorstr='#4096ee',GradientType=0 ); 
    color: #fff;
    font-family: 'Roboto', Arial, sans-serif;
}
.tooltip.top .tooltip-arrow {
    border-top-color: #7abcff;
}

.tooltip-inner工作正常,但.tooltip.top .tooltip-arrow不是; 它保持黑色.我假设.tooltip.top是底部对齐工具提示顶部的箭头.

任何帮助将不胜感激