精华内容
下载资源
问答
  • 自定义ToolTip

    2013-10-31 16:45:41
    自定义实现了仿Windows气泡,可以显示图标和多行文字,配有使用方法
  • 自定义tooltip

    2016-10-09 13:54:00
    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> </head> <style type="text/css">... po...
    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Document</title>
    </head>
    <style type="text/css">
    .myTitle {
      position: absolute;
      z-index: 5999;
      border: solid 1px #315B6C;
      padding: 2px 5px;
      color: #fff;
      background: none repeat scroll 0 0 #FFFFFF;
      border-radius: 3px;
      display: none;
      background-color: #222;
    }
    /* .myTitle:before {
      position: absolute;
      bottom: auto;
      left: -1px;
      top: -15px;
      border-color: transparent transparent transparent #315B6C;
      border-style: solid;
      border-width: 15px;
      content: "";
      display: block;
      width: 0;
      background-color: transparent;
    }
    .myTitle:after {
      position: absolute;
      bottom: auto;
      left: 0px;
      top: -13px;
      border-color: transparent transparent transparent #FFFFFF;
      border-style: solid;
      border-width: 15px;
      content: "";
      display: block;
      width: 0;
      background-color: transparent;
    } */
    </style>
    <body>
        <a href="http:vscss.com" title="vscss" >vscss</a>
    </body>
    
    <script type="text/javascript" src="http:vscss.com/dm/jquery.js"></script>
    <script type="text/javascript">
    $(function() {
      $("a[title]").each(function() {
        var a = $(this);
        var title = a.attr('title');
        if (title == undefined || title == "") return;
        a.data('title', title)
          .removeAttr('title')
          .hover(
            function () {
              var offset = a.offset();
              $("<div class=\"myTitle\"></div>").appendTo($("body")).html(title).css({ top: offset.top + a.outerHeight() - 1, left: offset.left + a.outerWidth() + 1 }).fadeIn(function () {
                var pop = $(this);
                //setTimeout(function () { pop.remove(); }, pop.text().length*80);
              });
            },
            function() { $(".myTitle").remove(); }
          );
      });
    });
    </script>
    </html>

     

    转载于:https://www.cnblogs.com/vscss/p/5941963.html

    展开全文
  • winform 自定义tooltip

    2017-09-05 09:47:14
    很好用的自定义tooltip,带有标题,内容,图标和关闭按钮,亲测可用,如有不懂可联系我。
  • 主要介绍了Jquery实现自定义tooltip的方法,需要的朋友可以参考下
  • ECHARTS3D 地球,解决TOOLTOP不显示问题.使用CSS自定义tooltip样式,完美显示。
  • Flex 自定义ToolTip

    2011-12-24 10:29:12
    Flex 自定义ToolTip源代码,可以运行的源代码
  • echarts 自定义tooltip样式 备份 在echarts文档中有个extraCssText可以进行自定义样式覆盖 最终效果图

    echarts 自定义tooltip样式

    备份

    在echarts文档中有个extraCssText可以进行自定义样式覆盖

    • 最终效果图
      截屏2020-10-14 上午8.55.00.png
    展开全文
  • echarts 自定义 tooltip 显示内容 在项目开发过程中,对于图形的需求,在使用echarts 的基本功能已经够项目的使用,但是也免不了 需要自定义的需求,这里简单的讲下怎么 自定义 tooltip 通过 tooltip 的 formatter...

    echarts 自定义 tooltip 显示内容

    在项目开发过程中,对于图形的需求,在使用echarts 的基本功能已经够项目的使用,但是也免不了
    需要自定义的需求,这里简单的讲下怎么 自定义 tooltip

    在这里插入图片描述
    formatter(params) {
    let htmlStr = ‘’
    for (let i = 0; i < params.length; i++) {
    const param = params[i]
    const name = param.seriesName
    const xName = param.name
    const value = param.value
    const color = param.color
    if (i === 0) {
    htmlStr += ${xName}</br>
    }
    htmlStr += ‘


    // eslint-disable-next-line max-len
    htmlStr += <span style="display:inline-block;margin-right:5px;border-radius:10px;width:10px;height:10px;background-color:${color};"></span>
    htmlStr += ${name}:${value} &nbsp;&nbsp;( ${}:${} , ${}:${} )
    htmlStr += ‘

    }
    return htmlStr
    },
    通过 tooltip 的 formatter 方法,自定义内容就可以,注意 params参数的值,是series数据里面传过去的

    展开全文
  • Qt自定义Tooltip

    千次阅读 2018-07-03 15:43:09
    系统自带的tooltip太简单了,自定义tooltip就灵活多了,可以定义各种各样的控件样式。 从QDialog继承 class Tooltip : public QDialog 设置无边框属性 setWindowFlags(Qt::FramelessWin...

    原文地址:https://www.ningto.com/post/5aa23e8a43bef42108349a5a

    系统自带的tooltip太简单了,自定义tooltip就灵活多了,可以定义各种各样的控件样式。

    从QDialog继承

    class Tooltip : public QDialog
    

    设置无边框属性

    setWindowFlags(Qt::FramelessWindowHint | Qt::Dialog);
    

    在鼠标点击其他地方的时候自动关闭

    • 安装this->installEventFilter(this);
    • 处理eventFilter
    bool Tooltip::eventFilter(QObject *obj, QEvent *e)
    {
        if (obj == this){
            if (QEvent::WindowDeactivate == e->type()){
                this->close();
                e->accept();
                return true;
            }
        }
        return QWidget::eventFilter(obj, e);
    }
    

    自动析构

    在tooltip关闭后自动销毁自身对象

    setAttribute(Qt::WA_DeleteOnClose);
    

    源码

    tooltip.h

    #ifndef TOOLTIP_H
    #define TOOLTIP_H
    
    #include <QDialog>
    
    class QLabel;
    class Tooltip : public QDialog
    {
    public:
        Tooltip(QWidget *parent = nullptr);
        ~Tooltip();
    
        void setText(const QString &text);
        static void popup(QPoint pos, const QString &text);
    
    protected:
        bool eventFilter(QObject *obj, QEvent *e);
    
    private:
        QLabel *label_;
    };
    
    #endif // TOOLTIP_H
    
    

    tooltip.cpp

    #include "tooltip.h"
    #include <QLabel>
    #include <QHBoxLayout>
    #include <QEvent>
    #include <QDebug>
    
    Tooltip::Tooltip(QWidget *parent)
        : QDialog(parent)
    {
        setWindowFlags(Qt::FramelessWindowHint | Qt::Dialog);
        setAttribute(Qt::WA_DeleteOnClose);
    
        label_ = new QLabel(this);
        QHBoxLayout *mLayout = new QHBoxLayout(this);
        mLayout->addWidget(label_);
    
        this->installEventFilter(this);
        this->setStyleSheet("QWidget { background: grey; }");
    }
    
    Tooltip::~Tooltip()
    {
    }
    
    void Tooltip::setText(const QString &text)
    {
        label_->setText(text);
    }
    
    bool Tooltip::eventFilter(QObject *obj, QEvent *e)
    {
        if (obj == this){
            if (QEvent::WindowDeactivate == e->type()){
                this->close();
                e->accept();
                return true;
            }
        }
        return QWidget::eventFilter(obj, e);
    }
    
    void Tooltip::popup(QPoint pos, const QString &text)
    {
        Tooltip *t = new Tooltip();
        t->setText(text);
        t->show();
        t->move(pos);
    }
    
    

    用法

    Tooltip::popup(QCursor::pos(), "hello");
    
    展开全文
  • echarts自定义tooltip

    2020-09-22 11:00:56
    echarts自定义tooltip显示 使用echarts展示图形的时候,鼠标滑倒图像上,想展示除了系列名,数据名,数据值以外的数据,这时需要使用tooltip的fommater方式进行配置,另外对数据格式也有一定的要求。 如下图志愿者...
  • 自定义tooltip
  • G2自定义Tooltip

    千次阅读 2018-11-16 16:41:06
    G2自定义Tooltip &lt;div id="interfaceChart" class="interface-chart-main"&gt;&lt;/div&gt; import G2 from '@antv/g2' import DataSet from '@antv/data-set' let chart ...
  • 表格单元格自定义ToolTip组件,适用所有Flex组件的自定义提示
  • 主要为大家介绍了利用纯CSS3打造的自定义Tooltip边框的应用,今天的这款Tooltip却可以用CSS3来自定义边框,边框呈涂鸦风格。用CSS3实现自定义边框的好处是可以自适应边框内部的文字数量大小
  • Echarts自定义tooltip提示框及图例 时间不语,却回答了所有问题。Echarts自定义tooltip提示框及图例解决什么问题自定义toolTipFormatter方法使用时传入params和定义的单位数组自定义图例效果 解决什么问题 我们在...
  • <div><p>可以自定义tooltip的显示格式吗。 <p>tooltip 显示的内容不仅仅包括 X 轴 与 Y 轴 的数据,需要加入其他的描述信息</p><p>该提问来源于开源项目:AAChartModel/AAChartKit</p></div>
  • Jquery自定义tooltip

    2014-02-12 14:57:18
    Jquery实现自定义tooltip,具体代码如下 #tooltip { position:absolute; border:1px solid #333; background:#f7f5d1; padding:1px; color:#333
  • v-charts 中自定义 tooltip 在使用 v-charts 折线图表时,想对 tooltip 自定义,查看 官网 发现可以使用 echarts options 属性; 官网解释:echarts配置项对应的属性被加到了组件上,可以直接覆盖options原有的对应...
  • echarts图 自定义tooltip的样式

    万次阅读 2019-03-24 13:55:40
    echarts图 自定义tooltip的样式 当碰到的需求需要在tooltip里面展示不同的内容的时候,比如在红色的区域显示的内容,和不在红色的区域显示又是不一样的内容。如下图: 怎么做的呢? 通过规则rules(规则根据需求来...
  • echartsECharts--自定义tooltip属性

    千次阅读 2019-11-11 21:47:08
    最近在做项目中用到了雷达图,需要用到自定义tooltip 查了相关资料。 一般的tooltip提供的简单的功能往往无法满足我们实际开发需要 ,那就动起手来 baidu吧 提示框浮层内容格式器,支持字符串模板和回调函数两种形式...
  • .NET WinForm中的DataGridView为程序开发提供了诸多的便利,...但DataGridView给我们带来这些开发便利的同时也制造了一些小麻烦,例如对于单元格的自动ToolTip功能,我们如何才能自定义ToolTip提示框的样式呢?这里...

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 1,262
精华内容 504
关键字:

自定义tooltip