标签: tooltip

如何在C#Winforms中为标签添加提示或工具提示?

看来,Label没有HintToolTipHovertext财产.那么当Label鼠标逼近时,显示提示,工具提示或悬停文本的首选方法是什么?

.net c# label tooltip winforms

76
推荐指数
5
解决办法
9万
查看次数

jQuery覆盖默认验证错误消息显示(Css)Popup/Tooltip之类的

我试图用div而不是标签来越过默认的错误消息标签.我也看过这篇文章,并了解如何做到这一点,但我对CSS的限制令我难以忘怀.我如何像其中一些示例一样显示:

示例#1(Dojo) - 必须键入无效输入才能看到错误显示
示例#2

下面是一些示例代码,它将错误标签覆盖为div元素

$(document).ready(function(){
            $("#myForm").validate({
                rules: {
                    "elem.1": {
                        required: true,
                        digits: true
                    },
                    "elem.2": {
                        required: true
                    }
                },
                errorElement: "div"
            });                  
        });
Run Code Online (Sandbox Code Playgroud)

现在我对css部分感到茫然,但现在它是:

div.error {
        position:absolute;
        margin-top:-21px;
     margin-left:150px;
     border:2px solid #C0C097;
        background-color:#fff;
        color:white;
        padding:3px;
        text-align:left;
        z-index:1;
        color:#333333;
     font:100% arial,helvetica,clean,sans-serif;
     font-size:15px;
     font-weight:bold;  
    }
Run Code Online (Sandbox Code Playgroud)

更新:

好吧我现在正在使用这个代码,但是弹出窗口上的图像和位置比边框大,可以调整为动态高度吗?

if (element.attr('type') == 'radio' || element.attr('type') == 'checkbox') {
   element = element.parent();

   offset = element.offset();
   error.insertBefore(element)
   error.addClass('message');  // add a class to the wrapper
   error.css('position', 'absolute');
   error.css('left', offset.left + …
Run Code Online (Sandbox Code Playgroud)

css jquery popup tooltip custom-errors

69
推荐指数
1
解决办法
16万
查看次数

如何在HTML"选项"标签上显示工具提示?

使用纯HTML或jQuery辅助JavaScript,如何在各个<option>元素上显示工具提示以帮助决策过程(没有足够的空间进行不同类型的控制,并且需要一些帮助).

这可以通过插件或类似方式完成吗?

我为jQuery尝试了一些工具提示插件但没有成功(包括名为Tooltip的插件).

该解决方案应该:

  • 在IE,WebKit以及Gecko工作;
  • 利用标准<select>包装<option>元素.

因此,如果解决方案想要使用其他标签,则应将这些元素动态转换为所需的元素(并且不要期望初始标记有任何不同).


这里的代码可以在这里找到,它位于SafeSurf部分下面,我想在选项翻转时显示一些关于选项含义的帮助.目前它只能在"事后"显示,并且对用户的一些前期帮助将是有益的.

感谢这并不容易,并且可能需要创建一些东西 - 所以赏金将被授予最完整的解决方案或特定的钩子,这使我最接近我可以创建的解决方案.

html jquery tooltip jquery-plugins

63
推荐指数
2
解决办法
12万
查看次数

Bootstrap工具提示导致按钮跳转

当我将鼠标悬停在按钮上并显示工具提示时,按钮会跳跃.如果我禁用工具提示,它不会跳转.此外,右按钮失去圆形边缘.我怎样才能防止这种情况发生?

<div class="btn-group">
    <a rel="tooltip" class="btn" href="#" data-title="View Details"><i class="icon-list-alt"></i></a>
    <a rel="tooltip" class="btn" href="#" data-title="Delete"><i class="icon-trash">    </i></a>
</div> 
Run Code Online (Sandbox Code Playgroud)

使用Javascript:

$('[rel=tooltip]').tooltip();
Run Code Online (Sandbox Code Playgroud)

工作版......

http://jsfiddle.net/BA4zM/147/

这是一个没有跳跃的网站...

http://wrapbootstrap.com/preview/WB005S479

css tooltip twitter-bootstrap

60
推荐指数
1
解决办法
2万
查看次数

触摸时代的工具提示

工具提示是了解应用程序非常有用的界面范例.它们是可视控件和与该控件关联的应用程序特定操作之间的映射.用户可以通过悬停鼠标指针来探索操作而无需调用它.

触摸设备使这种范例基本上不可能.这限制了应用程序的可用性,这在某些情况下变得非常神秘.

您是否知道触摸设备是否存在工具提示概念的替代品?它们在ui交互中实际上缺乏一个自由度:指针位置.如何有效地重新获得这种沟通渠道?

usability user-interface tooltip touch

58
推荐指数
5
解决办法
2万
查看次数

如何将工具提示添加到DataGridTextColumn

我正在使用WPFtoolkit DataGrid,我必须将文本换行DataGridTextColumn或者我必须ToolTip在文本列中添加一个.我在网上搜索过,但我找不到合适的解决方案.期待您的宝贵建议......

wpf datagrid tooltip datagridtextcolumn

57
推荐指数
2
解决办法
4万
查看次数

没有JavaScript的HTML内容工具提示

当您将鼠标悬停在网页的某个区域上时,有许多基于JavaScript的库可以显示工具提示.有些是相当简单的,有些允许工具提示显示用CSS设置样式的HTML内容.

但是有没有办法在不使用JavaScript的情况下显示样式化的工具提示?如果您只使用该title属性,则不会处理标记(例如foo<br />bar,不会产生换行符).我正在寻找一种解决方案,允许用户在不使用任何JavaScript的情况下显示样式化的HTML内容.

html css tooltip

54
推荐指数
5
解决办法
10万
查看次数

在工具提示中添加断裂线

¿如何在XAML的工具提示中为文本添加断行线?

我尝试这个:

        <Label Name="label4" UseLayoutRounding="False" Focusable="False" AllowDrop="False" Foreground="Black" Margin="6,44,132.027,76" ToolTipService.ShowDuration="12000">
                <Label.ToolTip>
                    <ToolTip>
                    <TextBlock>Lorem ipsum dolor sit amet, consectetur adipiscing elit. </TextBlock>
                    <TextBlock>Suspendisse eget urna eget elit ullamcorper tincidunt. Sed nec arcu sed ante sodales </TextBlock>
                    <TextBlock>Pellentesque elit libero, semper ac tincidunt vitae, euismod at ligula.</TextBlock>
                    </ToolTip>
                </Label.ToolTip>
            <Label.Content>
                <TextBlock TextAlignment="Right" TextWrapping="Wrap" Height="19" Width="108" >Lorem Ipsum</TextBlock>
            </Label.Content>
        </Label>
Run Code Online (Sandbox Code Playgroud)

但不起作用:

wpf xaml tooltip

53
推荐指数
5
解决办法
3万
查看次数

如何将twitter引导工具提示添加到图标

我会从twitter bootstrap添加一个右键工具提示到一个图标元素.

代码是这样的:

<h3>Sensors Permissions <i class="icon-info-sign"></i></h3>
Run Code Online (Sandbox Code Playgroud)

我想,当光标在图标上方时,会显示一个带有一些信息的正确工具提示......

我能怎么做?仅包含tooltip.js librery并在图标代码中添加一个元素是不够的?我糊涂了.

谢谢.

javascript tooltip twitter-bootstrap

51
推荐指数
3
解决办法
8万
查看次数

HTML-Tooltip相对于鼠标指针的位置

如何对齐工具提示的自然风格:鼠标指针的右下角?

~~~还有一些文本可以提交.~~~还有一些文本可以提交.~~~还有一些文本可以提交.~~~

<!DOCTYPE html>
<html>
<head>
  <title>Tooltip with Image</title>
  <meta charset="UTF-8">
  <style type="text/css">
    .tooltip {
        text-decoration:none;
        position:relative;
    }
     .tooltip span {
        display:none;
    }
     .tooltip span img {
        float:left;
    }
     .tooltip:hover span {
        display:block;
        position:absolute;
        overflow:hidden;
    }
  </style>
</head>
<body>
  <a class="tooltip" href="http://www.google.com/">
    Google
    <span>
      <img alt="" src="http://www.google.com/images/srpr/logo4w.png">
    </span>
  </a>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)

css alignment tooltip

51
推荐指数
4
解决办法
17万
查看次数