javascript - 时间轴 JScript 在 IExplorer 中不起作用-6ren

javascript - 时间轴 JScript 在 IExplorer 中不起作用

转载作者：行者123 更新时间：2023-11-28 08:06:22

我在我的网站上使用timeline JScript，原来的版本在Internet Explorer 中运行没有问题，但是当我将它移动到我的网站时，它不能再在IE 中运行(其他浏览器都可以正常运行)。我不明白为什么。

不工作，我的意思是，当我点击右键或年份时，它会转到我网站的顶部，而不是转移到那一年的幻灯片，但在其他浏览器中，它运行良好。

原始版本使用的是 jQuery v1.6，我使用的是 Jquery-1.7.1.min。

另一个问题是我的<h1>标签在 Chrome 浏览器中无法正常工作，我是否遗漏了什么？还要链接代码。

好的，我的<h1>添加 Google 字体样式表后，标签现在可以工作了，但是时间轴 JScript 仍然不能在 IE 中工作。

#header h1 {
	/*font-family: "Arial Black", Gadget, sans-serif;*/
	/*font-family: "Veneer" Gadget, sans-serif;*/
	font-family: "Maven pro", sans-serif;
	font-size: 70px;
	font-weight:900;
	line-height:70px;
	text-shadow: 3px 3px 5px rgba(122, 131, 175, 1);
	color:#FFF;
	text-transform: uppercase;
	text-align: center;
	margin: 0 auto;
	z-index:1;
}

/* ----------------------------------
jQuery Timelinr 0.9.3

tested with jQuery v1.6+
©2011 CSSLab.cl
free for any use, of course... :D
instructions: http://www.csslab.cl/2011/08/18/jquery-timelinr/
---------------------------------- */

jQuery.fn.timelinr = function(options) {
  // default plugin settings
  settings = jQuery.extend({
    orientation: 'horizontal', // value: horizontal | vertical, default to horizontal
    containerDiv: '#timeline', // value: any HTML tag or #id, default to #timeline
    datesDiv: '#dates', // value: any HTML tag or #id, default to #dates
    datesSelectedClass: 'selected', // value: any class, default to selected
    datesSpeed: 500, // value: integer between 100 and 1000 (recommended), default to 500 (normal)
    lrzj_lineDiv: '#lrzj_line', // value: any HTML tag or #id, default to #lrzj_line
    lrzj_lineSelectedClass: 'selected', // value: any class, default to selected
    lrzj_lineSpeed: 200, // value: integer between 100 and 1000 (recommended), default to 200 (fast)
    lrzj_lineTransparency: 0.2, // value: integer between 0 and 1 (recommended), default to 0.2
    lrzj_lineTransparencySpeed: 500, // value: integer between 100 and 1000 (recommended), default to 500 (normal)
    prevButton: '#prev', // value: any HTML tag or #id, default to #prev
    nextButton: '#next', // value: any HTML tag or #id, default to #next
    arrowKeys: 'false', // value: true/false, default to false
    startAt: 1 // value: integer, default to 1 (first)
  }, options);

  $(function() {
    // setting variables... many of them
    var howManyDates = $(settings.datesDiv + ' li').length;
    var howManylrzj_line = $(settings.lrzj_lineDiv + ' li').length;
    var currentDate = $(settings.datesDiv).find('a.' + settings.datesSelectedClass);
    var currentIssue = $(settings.lrzj_lineDiv).find('li.' + settings.lrzj_lineSelectedClass);
    var widthContainer = $(settings.containerDiv).width();
    var heightContainer = $(settings.containerDiv).height();
    var widthlrzj_line = $(settings.lrzj_lineDiv).width();
    var heightlrzj_line = $(settings.lrzj_lineDiv).height();
    var widthIssue = $(settings.lrzj_lineDiv + ' li').width();
    var heightIssue = $(settings.lrzj_lineDiv + ' li').height();
    var widthDates = $(settings.datesDiv).width();
    var heightDates = $(settings.datesDiv).height();
    var widthDate = $(settings.datesDiv + ' li').width();
    var heightDate = $(settings.datesDiv + ' li').height();

    // set positions!
    if (settings.orientation == 'horizontal') {
      $(settings.lrzj_lineDiv).width(widthIssue * howManylrzj_line);
      $(settings.datesDiv).width(widthDate * howManyDates).css('marginLeft', widthContainer / 2 - widthDate / 2);
      var defaultPositionDates = parseInt($(settings.datesDiv).css('marginLeft').substring(0, $(settings.datesDiv).css('marginLeft').indexOf('px')));
    } else if (settings.orientation == 'vertical') {
      $(settings.lrzj_lineDiv).height(heightIssue * howManylrzj_line);
      $(settings.datesDiv).height(heightDate * howManyDates).css('marginTop', heightContainer / 2 - heightDate / 2);
      var defaultPositionDates = parseInt($(settings.datesDiv).css('marginTop').substring(0, $(settings.datesDiv).css('marginTop').indexOf('px')));
    }
    /* 代码整理：懒人之家 www.lanrenzhijia.com  转载请注明出处 */
    $(settings.datesDiv + ' a').click(function(event) {
      event.preventDefault();
      // first vars
      var whichIssue = $(this).text();
      var currentIndex = $(this).parent().prevAll().length;

      // moving the elements
      if (settings.orientation == 'horizontal') {
        $(settings.lrzj_lineDiv).animate({
          'marginLeft': -widthIssue * currentIndex
        }, {
          queue: false,
          duration: settings.lrzj_lineSpeed
        });
      } else if (settings.orientation == 'vertical') {
        $(settings.lrzj_lineDiv).animate({
          'marginTop': -heightIssue * currentIndex
        }, {
          queue: false,
          duration: settings.lrzj_lineSpeed
        });
      }
      $(settings.lrzj_lineDiv + ' li').animate({
        'opacity': settings.lrzj_lineTransparency
      }, {
        queue: false,
        duration: settings.lrzj_lineSpeed
      }).removeClass(settings.lrzj_lineSelectedClass).eq(currentIndex).addClass(settings.lrzj_lineSelectedClass).fadeTo(settings.lrzj_lineTransparencySpeed, 1);

      // now moving the dates
      $(settings.datesDiv + ' a').removeClass(settings.datesSelectedClass);
      $(this).addClass(settings.datesSelectedClass);
      if (settings.orientation == 'horizontal') {
        $(settings.datesDiv).animate({
          'marginLeft': defaultPositionDates - (widthDate * currentIndex)
        }, {
          queue: false,
          duration: settings.datesSpeed
        });
      } else if (settings.orientation == 'vertical') {
        $(settings.datesDiv).animate({
          'marginTop': defaultPositionDates - (heightDate * currentIndex)
        }, {
          queue: false,
          duration: settings.datesSpeed
        });
      }
    });
    /* 代码整理：懒人之家 www.lanrenzhijia.com  转载请注明出处 */
    $(settings.nextButton).bind('click', function(event) {
      event.preventDefault();
      if (settings.orientation == 'horizontal') {
        var currentPositionlrzj_line = parseInt($(settings.lrzj_lineDiv).css('marginLeft').substring(0, $(settings.lrzj_lineDiv).css('marginLeft').indexOf('px')));
        var currentIssueIndex = currentPositionlrzj_line / widthIssue;
        var currentPositionDates = parseInt($(settings.datesDiv).css('marginLeft').substring(0, $(settings.datesDiv).css('marginLeft').indexOf('px')));
        var currentIssueDate = currentPositionDates - widthDate;
        if (currentPositionlrzj_line <= -(widthIssue * howManylrzj_line - (widthIssue))) {
          $(settings.lrzj_lineDiv).stop();
          $(settings.datesDiv + ' li:last-child a').click();
        } else {
          if (!$(settings.lrzj_lineDiv).is(':animated')) {
            $(settings.lrzj_lineDiv).animate({
              'marginLeft': currentPositionlrzj_line - widthIssue
            }, {
              queue: false,
              duration: settings.lrzj_lineSpeed
            });
            $(settings.lrzj_lineDiv + ' li').animate({
              'opacity': settings.lrzj_lineTransparency
            }, {
              queue: false,
              duration: settings.lrzj_lineSpeed
            });
            $(settings.lrzj_lineDiv + ' li.' + settings.lrzj_lineSelectedClass).removeClass(settings.lrzj_lineSelectedClass).next().fadeTo(settings.lrzj_lineTransparencySpeed, 1).addClass(settings.lrzj_lineSelectedClass);
            $(settings.datesDiv).animate({
              'marginLeft': currentIssueDate
            }, {
              queue: false,
              duration: settings.datesSpeed
            });
            $(settings.datesDiv + ' a.' + settings.datesSelectedClass).removeClass(settings.datesSelectedClass).parent().next().children().addClass(settings.datesSelectedClass);
          }
        }
      } else if (settings.orientation == 'vertical') {
        var currentPositionlrzj_line = parseInt($(settings.lrzj_lineDiv).css('marginTop').substring(0, $(settings.lrzj_lineDiv).css('marginTop').indexOf('px')));
        var currentIssueIndex = currentPositionlrzj_line / heightIssue;
        var currentPositionDates = parseInt($(settings.datesDiv).css('marginTop').substring(0, $(settings.datesDiv).css('marginTop').indexOf('px')));
        var currentIssueDate = currentPositionDates - heightDate;
        if (currentPositionlrzj_line <= -(heightIssue * howManylrzj_line - (heightIssue))) {
          $(settings.lrzj_lineDiv).stop();
          $(settings.datesDiv + ' li:last-child a').click();
        } else {
          if (!$(settings.lrzj_lineDiv).is(':animated')) {
            $(settings.lrzj_lineDiv).animate({
              'marginTop': currentPositionlrzj_line - heightIssue
            }, {
              queue: false,
              duration: settings.lrzj_lineSpeed
            });
            $(settings.lrzj_lineDiv + ' li').animate({
              'opacity': settings.lrzj_lineTransparency
            }, {
              queue: false,
              duration: settings.lrzj_lineSpeed
            });
            $(settings.lrzj_lineDiv + ' li.' + settings.lrzj_lineSelectedClass).removeClass(settings.lrzj_lineSelectedClass).next().fadeTo(settings.lrzj_lineTransparencySpeed, 1).addClass(settings.lrzj_lineSelectedClass);
            $(settings.datesDiv).animate({
              'marginTop': currentIssueDate
            }, {
              queue: false,
              duration: settings.datesSpeed
            });
            $(settings.datesDiv + ' a.' + settings.datesSelectedClass).removeClass(settings.datesSelectedClass).parent().next().children().addClass(settings.datesSelectedClass);
          }
        }
      }
    });
    /* 代码整理：懒人之家 www.lanrenzhijia.com  转载请注明出处 */
    $(settings.prevButton).click(function(event) {
      event.preventDefault();
      if (settings.orientation == 'horizontal') {
        var currentPositionlrzj_line = parseInt($(settings.lrzj_lineDiv).css('marginLeft').substring(0, $(settings.lrzj_lineDiv).css('marginLeft').indexOf('px')));
        var currentIssueIndex = currentPositionlrzj_line / widthIssue;
        var currentPositionDates = parseInt($(settings.datesDiv).css('marginLeft').substring(0, $(settings.datesDiv).css('marginLeft').indexOf('px')));
        var currentIssueDate = currentPositionDates + widthDate;
        if (currentPositionlrzj_line >= 0) {
          $(settings.lrzj_lineDiv).stop();
          $(settings.datesDiv + ' li:first-child a').click();
        } else {
          if (!$(settings.lrzj_lineDiv).is(':animated')) {
            $(settings.lrzj_lineDiv).animate({
              'marginLeft': currentPositionlrzj_line + widthIssue
            }, {
              queue: false,
              duration: settings.lrzj_lineSpeed
            });
            $(settings.lrzj_lineDiv + ' li').animate({
              'opacity': settings.lrzj_lineTransparency
            }, {
              queue: false,
              duration: settings.lrzj_lineSpeed
            });
            $(settings.lrzj_lineDiv + ' li.' + settings.lrzj_lineSelectedClass).removeClass(settings.lrzj_lineSelectedClass).prev().fadeTo(settings.lrzj_lineTransparencySpeed, 1).addClass(settings.lrzj_lineSelectedClass);
            $(settings.datesDiv).animate({
              'marginLeft': currentIssueDate
            }, {
              queue: false,
              duration: settings.datesSpeed
            });
            $(settings.datesDiv + ' a.' + settings.datesSelectedClass).removeClass(settings.datesSelectedClass).parent().prev().children().addClass(settings.datesSelectedClass);
          }
        }
      } else if (settings.orientation == 'vertical') {
        var currentPositionlrzj_line = parseInt($(settings.lrzj_lineDiv).css('marginTop').substring(0, $(settings.lrzj_lineDiv).css('marginTop').indexOf('px')));
        var currentIssueIndex = currentPositionlrzj_line / heightIssue;
        var currentPositionDates = parseInt($(settings.datesDiv).css('marginTop').substring(0, $(settings.datesDiv).css('marginTop').indexOf('px')));
        var currentIssueDate = currentPositionDates + heightDate;
        if (currentPositionlrzj_line >= 0) {
          $(settings.lrzj_lineDiv).stop();
          $(settings.datesDiv + ' li:first-child a').click();
        } else {
          if (!$(settings.lrzj_lineDiv).is(':animated')) {
            $(settings.lrzj_lineDiv).animate({
              'marginTop': currentPositionlrzj_line + heightIssue
            }, {
              queue: false,
              duration: settings.lrzj_lineSpeed
            });
            $(settings.lrzj_lineDiv + ' li').animate({
              'opacity': settings.lrzj_lineTransparency
            }, {
              queue: false,
              duration: settings.lrzj_lineSpeed
            });
            $(settings.lrzj_lineDiv + ' li.' + settings.lrzj_lineSelectedClass).removeClass(settings.lrzj_lineSelectedClass).prev().fadeTo(settings.lrzj_lineTransparencySpeed, 1).addClass(settings.lrzj_lineSelectedClass);
            $(settings.datesDiv).animate({
              'marginTop': currentIssueDate
            }, {
              queue: false,
              duration: settings.datesSpeed
            }, {
              queue: false,
              duration: settings.lrzj_lineSpeed
            });
            $(settings.datesDiv + ' a.' + settings.datesSelectedClass).removeClass(settings.datesSelectedClass).parent().prev().children().addClass(settings.datesSelectedClass);
          }
        }
      }
    });
    /* 代码整理：懒人之家 www.lanrenzhijia.com  转载请注明出处 */
    // keyboard navigation, added since 0.9.1
    if (settings.arrowKeys == 'true') {
      if (settings.orientation == 'horizontal') {
        $(document).keydown(function(event) {
          if (event.keyCode == 39) {
            $(settings.nextButton).click();
          }
          if (event.keyCode == 37) {
            $(settings.prevButton).click();
          }
        });
      } else if (settings.orientation == 'vertical') {
        $(document).keydown(function(event) {
          if (event.keyCode == 40) {
            $(settings.nextButton).click();
          }
          if (event.keyCode == 38) {
            $(settings.prevButton).click();
          }
        });
      }
    }
    /* 代码整理：懒人之家 www.lanrenzhijia.com  转载请注明出处 */
    // default position startAt, added since 0.9.3
    $(settings.datesDiv + ' li').eq(settings.startAt - 1).find('a').trigger('click');

  });

};

.timeline_bg {
  width: 100%;
  height: 1080px;
  position: relative;
  z-index: 400;
}
.timeline_wrapper {
  width: 960px;
  height: 1080px;
  margin: 0 auto;
}
#lrzj_x {
  width: 960px;
  height: 350px;
  overflow: hidden;
  margin: 0 auto;
  position: relative;
  background: url(../image/dot.gif) left 45px repeat-x;
}
#lrzj_x a {
  color: #117FB2;
  -webkit-mask-box-image: -webkit-gradient(linear, left top, left bottom, color-stop(20%, rgba(0, 0, 0, 1)), color-stop(100%, rgba(0, 0, 0, 0)));
  text-decoration: none;
  -webkit-transition: 0.5s;
  -moz-transition: 0.5s;
  -o-transition: 0.5s;
  -ms-transition: 0.5s;
  transition: 0.5s;
}
#lrzj_x a:hover {
  color: #ffcc00;
}
#lrzj_x a.selected {
  color: #ffcc00;
}
#dates {
  width: 960px;
  height: 60px;
  overflow: hidden;
}
#dates li {
  list-style: none;
  float: left;
  width: 100px;
  height: 50px;
  font-size: 24px;
  text-align: center;
  background: url(../image/biggerdot.png) center bottom no-repeat;
}
#dates a {
  line-height: 38px;
  padding-bottom: 10px;
}
#dates .selected {
  font-size: 38px;
}
#lrzj_line {
  width: 800px;
  height: 350px;
  overflow: hidden;
}
#lrzj_line li {
  width: 800px;
  height: 350px;
  list-style: none;
  float: left;
}
#lrzj_line li img {
  float: left;
  margin: 10px 30px 10px 50px;
}
#lrzj_line li h1 {
  color: #ffcc00;
  font-size: 48px;
  margin: 20px 0;
  text-shadow: #000 1px 1px 2px;
}
#lrzj_line li p {
  font-size: 14px;
  margin-right: 70px;
  font-weight: normal;
  line-height: 22px;
  text-shadow: #000 1px 1px 2px;
}
#next,
#prev {
  position: absolute;
  top: 0;
  font-size: 70px;
  top: 200px;
  width: 50px;
  height: 70px;
  background-position: 0 0;
  background-repeat: no-repeat;
  text-indent: -9999px;
  overflow: hidden;
}
#next:hover,
#prev:hover {
  background-position: 0;
}
#next {
  right: 10px;
  background-image: url(../image/navigate-right-icon.png);
}
#prev {
  left: 10px;
  background-image: url(../image/navigate-left-icon.png);
}
#next.disabled,
#prev.disabled {
  opacity: 0.2;
}

<div class="timeline_bg">
  <div class="timeline_wrapper">
    <div class="title">
      <div class="title_line"></div>
      <h5>My Timeline</h5> 
      <div class="title_line"></div>
    </div>
    <!-- title end here -->

    <div id="lrzj_x">
      <ul id="dates">
        <li><a href="#">01-04</a>
        </li>
        <li><a href="#">04-06</a>
        </li>
        <li><a href="#">08-09</a>
        </li>
        <li><a href="#">09-10</a>
        </li>
        <li><a href="#">2010</a>
        </li>
        <li><a href="#">2011</a>
        </li>
        <li><a href="#">2012</a>
        </li>
        <li><a href="#">2013</a>
        </li>
        <li><a href="#">2014</a>
        </li>
      </ul>

      <ul id="lrzj_line">
        <li id="#01-04">
          <img src="images/1.png" width="256" height="256" />
          <h1>2001-2004</h1>
          <p>Donec semper quam scelerisque tortor dictum gravida. In hac habitasse platea dictumst. Nam pulvinar, odio sed rhoncus suscipit, sem diam ultrices mauris, eu consequat purus metus eu velit. Proin metus odio, aliquam eget molestie nec, gravida
            ut sapien. Phasellus quis est sed turpis sollicitudin venenatis sed eu odio. Praesent eget neque eu eros interdum malesuada non vel leo. Sed fringilla porta ligula.</p>
        </li>
        <li id="#04-06">
          <img src="images/2.png" width="256" height="256" />
          <h1>1930</h1>
          <p>Donec semper quam scelerisque tortor dictum gravida. In hac habitasse platea dictumst. Nam pulvinar, odio sed rhoncus suscipit, sem diam ultrices mauris, eu consequat purus metus eu velit. Proin metus odio, aliquam eget molestie nec, gravida
            ut sapien. Phasellus quis est sed turpis sollicitudin venenatis sed eu odio. Praesent eget neque eu eros interdum malesuada non vel leo. Sed fringilla porta ligula.</p>
        </li>
        <li id="#08-09">
          <img src="images/3.png" width="256" height="256" />
          <h1>1944</h1>
          <p>Donec semper quam scelerisque tortor dictum gravida. In hac habitasse platea dictumst. Nam pulvinar, odio sed rhoncus suscipit, sem diam ultrices mauris, eu consequat purus metus eu velit. Proin metus odio, aliquam eget molestie nec, gravida
            ut sapien. Phasellus quis est sed turpis sollicitudin venenatis sed eu odio. Praesent eget neque eu eros interdum malesuada non vel leo. Sed fringilla porta ligula.</p>
        </li>
        <li id="#09-10">
          <img src="images/3.png" width="256" height="256" />
          <h1>1944</h1>
          <p>Donec semper quam scelerisque tortor dictum gravida. In hac habitasse platea dictumst. Nam pulvinar, odio sed rhoncus suscipit, sem diam ultrices mauris, eu consequat purus metus eu velit. Proin metus odio, aliquam eget molestie nec, gravida
            ut sapien. Phasellus quis est sed turpis sollicitudin venenatis sed eu odio. Praesent eget neque eu eros interdum malesuada non vel leo. Sed fringilla porta ligula.</p>
        </li>
        <li id="#2010">
          <img src="images/3.png" width="256" height="256" />
          <h1>1944</h1>
          <p>Donec semper quam scelerisque tortor dictum gravida. In hac habitasse platea dictumst. Nam pulvinar, odio sed rhoncus suscipit, sem diam ultrices mauris, eu consequat purus metus eu velit. Proin metus odio, aliquam eget molestie nec, gravida
            ut sapien. Phasellus quis est sed turpis sollicitudin venenatis sed eu odio. Praesent eget neque eu eros interdum malesuada non vel leo. Sed fringilla porta ligula.</p>
        </li>
        <li id="#2011">
          <img src="images/3.png" width="256" height="256" />
          <h1>1944</h1>
          <p>Donec semper quam scelerisque tortor dictum gravida. In hac habitasse platea dictumst. Nam pulvinar, odio sed rhoncus suscipit, sem diam ultrices mauris, eu consequat purus metus eu velit. Proin metus odio, aliquam eget molestie nec, gravida
            ut sapien. Phasellus quis est sed turpis sollicitudin venenatis sed eu odio. Praesent eget neque eu eros interdum malesuada non vel leo. Sed fringilla porta ligula.</p>
        </li>
        <li id="#2012">
          <img src="images/3.png" width="256" height="256" />
          <h1>1944</h1>
          <p>Donec semper quam scelerisque tortor dictum gravida. In hac habitasse platea dictumst. Nam pulvinar, odio sed rhoncus suscipit, sem diam ultrices mauris, eu consequat purus metus eu velit. Proin metus odio, aliquam eget molestie nec, gravida
            ut sapien. Phasellus quis est sed turpis sollicitudin venenatis sed eu odio. Praesent eget neque eu eros interdum malesuada non vel leo. Sed fringilla porta ligula.</p>
        </li>
        <li id="#2013">
          <img src="images/3.png" width="256" height="256" />
          <h1>1944</h1>
          <p>Donec semper quam scelerisque tortor dictum gravida. In hac habitasse platea dictumst. Nam pulvinar, odio sed rhoncus suscipit, sem diam ultrices mauris, eu consequat purus metus eu velit. Proin metus odio, aliquam eget molestie nec, gravida
            ut sapien. Phasellus quis est sed turpis sollicitudin venenatis sed eu odio. Praesent eget neque eu eros interdum malesuada non vel leo. Sed fringilla porta ligula.</p>
        </li>
        <li id="#2014">
          <img src="images/3.png" width="256" height="256" />
          <h1>1944</h1>
          <p>Donec semper quam scelerisque tortor dictum gravida. In hac habitasse platea dictumst. Nam pulvinar, odio sed rhoncus suscipit, sem diam ultrices mauris, eu consequat purus metus eu velit. Proin metus odio, aliquam eget molestie nec, gravida
            ut sapien. Phasellus quis est sed turpis sollicitudin venenatis sed eu odio. Praesent eget neque eu eros interdum malesuada non vel leo. Sed fringilla porta ligula.</p>
        </li>
      </ul>
      <a href="#" id="next">+</a>
      <a href="#" id="prev">-</a>
    </div>
    <!--time line script end here -->
  </div>
  <!-- timeline wrapper -->
</div>
<!-- time line end here -->

最佳答案

只需在函数末尾添加(jQuery)。

Working fiddle

关于javascript - 时间轴 JScript 在 IExplorer 中不起作用，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/29467870/

文章推荐： c++ - 如何将 JPEG 转换为 DCT 8 x 8？

文章推荐： ios - 将 SpriteNode 与碰撞表面对齐 SpriteKit Swift3

文章推荐： html - 页面顶部和页眉之间的空间

文章推荐： javascript - Webiopi 多按钮 css

时间轴、流程类时间轴绘制
目录效果图思路具体实现步骤一：ItemView顶部偏移步骤二：绘制圆和线条注意：下标的获取流程类的绘制
javascript - 时间轴 - 下一个和上一个事件
我正在尝试构建一个时间轴，但是当我点击其中一个圆圈时我无法实现该功能事件的绿色条已完成，或者如果我点击前一个圆圈则“禁用”，我的代码 CodePen 我尝试过的 Toggle var compl
JavaFx 时间轴 - 设置初始延迟
我最近开始使用 JavaFx 2.0，也许我的问题很基本，但目前我不知道如何解决它。例如，假设我有一个名为 Clock 的小型演示应用程序: import javafx.animation.KeyFr
javascript - HTML5 时间轴、甘特图控件
我需要创建一个基于自定义 HTML5 的控件，该控件是时间线和甘特图之间的交叉: 但是，我无法获得市场上已有的第三方控件来减少一些开发时间。它需要在顶部有微型缩小的时间轴以进行快速导航，滚动时会更新主
perl - 推特 LED 时间轴
你好，我已经为 twitter 时间线编写了一个脚本，除了我不知道如何授权我的 twitter api key ，我的 led 标志只是说“错误的身份验证数据” 这是我的代码 #!/usr/bin/p
javascript - D3 时间轴 - 为什么默认情况下刻度线似乎不可见？
我正在使用 X 时间轴绘制一个非常规则的图表。轴代码非常标准: var xScale = d3.time.scale() .domain([tlState.startd
java - 将多张照片发布到 Facebook 时间轴
谁能帮我解释一下如何使用图形 api 发布带有照片(不是一张照片)的状态；我尝试将照片添加到 me/photos 但我不需要查看以前帖子中的照片。当我使用类似 TIMELINE_ALBUM/pho
jquery - 格式化 jquery 时间轴？
我正在使用来自 here 的时间轴插件这是我当前的代码: 1940s 1950s 1960s 1970s 1980s 1990s 2000s 1940's Ronald. 1950's
javascript - 用于显示事件的日历(时间轴)小部件
我有一些事件:有些是连续的，有些只是一天的事件。我想在网页上精美地展示它们。有一堆日期选择器 jQuery 插件，但我找不到任何用于显示事件的插件。可以是canvas，也可以是svg，也可以是cs
html - 带有连接线的响应式 CSS 时间轴
我正在尝试创建一个响应式时间轴，它的行为类似于 ( https://codepen.io/anon/pen/KoGdqG): 对于大于 600px 的宽度是水平的。每个部分的宽度是响应式的；对于小于
jquery - 带有图像的 Bootstrap 时间轴
在我复制并粘贴来自 https://mdbootstrap.com/plugins/jquery/timeline/#images 的代码之后，为什么图像看起来很大，我该怎么做才能使左侧和右侧的内容变
android - 如何处理垂直 RecyclerView 时间轴？
我想创建一个垂直的动态时间轴，左边是发生的时间，右边是发生的事情，中间有一条线，每个事件的线上都有一个气泡。时间、事件和事件数量将是动态的。我在这里想的可能是垂直线的静态图像上的 RecyclerV
swiftui - 想要为延时(时间轴)重新创建以下 UI
我正在尝试重新创建以下内容: 我有以下代码，其中包含它的要点，但不是确切的外观和感觉，我仍在尝试掌握 Swift 的 UI 方面。 VStack(spacing: 30) {
javascript - AngularJS Google 图表 - 时间轴
在使用下面的代码使用 AngularJS 生成时间线图表时，我遇到了一个问题。基本上我无法找到导入时间线包的正确方法。就像下面导入 corechart 包一样，我如何导入时间线... google.
javascript - 设置 Twitter 时间轴 href
我正在尝试使用 javascript 或 jquery 在我的 Twitter 时间轴上动态设置 href 字段，我该如何执行此操作？ Tweets by me 最佳答案使用setAttribut
tensorflow - 如何在 Tensorflow 中读取跟踪文件(时间轴)
时间轴跟踪文件介绍如下: https://www.tensorflow.org/versions/r1.1/performance/xla/jit 这对于性能分析似乎很有用。但有一点我不明白。 1、“
csv - D3 时间轴 CSV 数据
我正在使用 d3 Timeline 插件 ( https://github.com/jiahuang/d3-timeline )，我终于得到了可视化可以读取我的数据的地方。但是，我现在需要使特定学生的
javascript - 谷歌图表 - 时间轴 : Scaling Axis
我正在尝试使用 Google 的时间轴创建一个图表来显示过去 7 天的事件，但我在缩放 x 轴时遇到了问题。图表总是试图根据数据自动缩放，这破坏了我想要合并的一致性。我希望图表的右侧是今天的日期，左
jquery - Google map 时间轴 slider
获取多个 KML 文件(每个文件代表不同的日期)并创建带有 slider 的 Google map 的最佳方法是什么？最佳答案尝试http://code.google.com/p/timemap/
jquery - CSS/Jquery 时间轴/调度程序显示
我一直在尝试为预定的事件构建一个网络显示。每个事件都有一个动态计算的宽度(基于事件持续时间)和 margin-left(基于开始时间)。每个事件也有一个高度，基于需要显示的内容。如果没有重叠事件将元素

行者123

个人简介

我是一名优秀的程序员,十分优秀！

作者热门文章

滴滴打车优惠券免费领取

全站热门文章

首页

博学

6Ren·AI

商城

javascript - 时间轴 JScript 在 IExplorer 中不起作用