阅读 75

记录-通过raphael.min.js实现table表头斜线

通过raphael.min.js实现table表头斜线

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <script type="text/javascript" src="http://cdn.bootcss.com/jquery/1.11.3/jquery.min.js">script>
    <script type="text/javascript" src="http://cdn.bootcss.com/raphael/2.2.7/raphael.min.js">script>
head>

<body>
    <div id="lineDiv" style=‘position:absolute;z-index:9999;‘>div>
    <table cellspacing="0" cellpadding="0" style="border-collapse:collapse;">
        <tr>
            <td id="lineTd" style="border:#000000 solid 1px;width:219px;height:76px;vertical-align:top;"
                points="[110,79,222,42,222,79]">
                                                       月份<br>                    <br>                         <br>省份                    城市
            td>

            <td style="text-align:center;border:#000000 solid 1px;height:45px;vertical-align:top;">201206td>
        tr>
        <tr>
            <td style="text-align:center;border:#000000 solid 1px;width:89px;height:32px;vertical-align:top;">潜在客户数td>
            <td style="text-align:center;border:#000000 solid 1px;width:89px;height:32px;vertical-align:top;">新增客户数td>
        tr>
    table>
body>
<script>
    $(function () {
        var paper = new Raphael("lineDiv");
        paper.path("M0,0L110,85");//坐标(0,0)(110,85)
        paper.path("M0,0L220,52");//坐标(0,0)(220,42)
        //   paper.path("M0,0L220,79");//坐标(0,0)(220,79)
        var offset = $("#lineTd").offset();//td的位置
        //将画线的DIV移动到td的位置
        $("#lineDiv").offset({ top: offset.top, left: offset.left });
    })
script>

html>

最终效果

大家还有什么好的方法可以告诉我呀,谢谢啦~

原文:https://www.cnblogs.com/Ananiah/p/14965585.html

文章分类
代码人生
版权声明:本站是系统测试站点,无实际运营。本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至 XXXXXXo@163.com 举报,一经查实,本站将立刻删除。
相关推荐