javascript - jQuery 或 JavaScript 中是否有等效的 ScrollBottom？

转载作者：行者123 更新时间：2023-11-30 16:04:03

已解决

@Lesley 的回答解决了我的问题:

    $('.timeline-wrapper').on('click', function () {
var self = this;
setTimeout(function () {
    divOffset = $(self).offset().top;
    divHeight = $(self).height();
    viewportHeight = $(window).height();

    $('body, html').animate({
        scrollTop : divOffset + divHeight - viewportHeight
    });
}, 1000);

这个元素使用了 2 个插件:

> timeliner.js
> colorbox.js *

我修改了它，这样当一个 div 打开时，它会滚动到顶部并在它的顶部边缘位于视口(viewport)顶部时停止。现在我需要它在展开后滚动到底部，然后在底部边缘位于视口(viewport)底部时停止。以下是精简版，但没有任何原始功能。只有内容，所以你看到的几乎是我在我的网站上使用的所有内容。我尝试的内容在源代码中进行了评论。

*colobox.js 实际上包含在 timeliner.js 中，但我提到它是因为它可以独立。

最有可能关注的领域

$('.timeline-wrapper').on('click', function () {
                var self = this;
                setTimeout(function () {
                    xOffset = $(self).offset();
                    $('body, html').animate({
                        scrollTop : xOffset.top
                    });
                }, 910);
        });

片段

/* ======= CORE LAYOUT ======= */
body {
	position: relative;
  background-color: #222;
  color: #eeefef;
  font-size: 62.5%;
  font-family: Arial, Helvetica, sans-serif;
  margin: 0;
  padding: 0;
	height: 200vh;
}
.container {
	position: relative;
	top: 0;
	margin-left: calc(50% - 22em);
  width: 44em;
  padding: 10px;
}
.banner {
	position: absolute;
	top: 0;
	left: 0;
	z-index: -1;
	opacity: 1;
	background-size: contain;
	background-position: left center;
	height: 190px;
}
h1 {
  color: #f8c73e;
  font-size: 36px;
  font-weight: 900;
	letter-spacing: .2em;
	line-height: 2;
  margin: 0 0 0 -20px;
}
h2 {
  font-size: 22px;
  font-weight: 400;
  margin: 5px 0;
  letter-spacing: .1em;
}
h3 {
  font-size: 1.6em;
  margin: 10px 0 10px 10px;
}
a:link,
a:visited {
  color: #7097af;
  text-decoration: none;
}
a:hover {
  color: #0ff;
}
a img {
  border: none;
}
p {
  margin: 0 0 10px 8px;
  font-size: 1.5em;
  font-weight: 400;
  line-height: 1.6em;
}
.lead {
  font-size: 2em;
  margin-bottom: 40px;
}
.clear {
  clear: both;
  line-height: 0;
  font-size: 0;
}

/* ============ TIMELINER.JS ============= */
.timeline-container {
	position: relative;
	top: 15em;
  bottom: 0;
  border-left: 5px solid #f8c73e;
  margin-left: calc(50% - 300px);
	margin-top: 5px;
  width: 600px;
}
.timeline-toggle {
  background: #000;
  border-color: #161616;
  border-radius: 4px;
  color: #fc3;
  cursor: pointer;
  float: right;
  font-size: 14px;
  margin-right: 40px;
  padding: 3px 5px;
  white-space: pre-line;
	width: 15%;
}
.timeline-time {
	position: relative;
	display: table-row;
}
.timeline-time span.timeline-milestone {
	background: url(../img/milestone.png) left center no-repeat;
	z-index: 1;
	display: table-cell;
	position: absolute;
	left: 0;
	top: 50%;
	transform: translateY(-50%);
}

.timeline-time button.time.time {
	font: 500 1.3rem/1.6 "Open Sans";
	text-align: center;
	padding: 0 0 2px 0;
	position: relative;
	z-index: 9;
	background: #f8c73e;
	height: 60px;
	width: 60px;
	border-radius: 50%;
	border: none;
	cursor: pointer;
	color: #000;
	display: table-cell;
}

.timeline-time button.time.time:hover,
.timeline-time button.time.time:active,
.timeline-time button.time.time:focus {
	background: #317bb6; 
	color: #DDD; 
	outline: 0 none transparent;	
}	

.timeline-wrapper {
  clear: left;
  float: left;
  margin: 0 0 12px;
  width: 600px;
	
}
.timeline-wrapper h2 {
  background: transparent;
  font-family: "Open Sans";
  cursor: pointer;
  font-size: 2.2em;
  font-weight: 700;
  margin: 0;
  padding: 4px;
	vertical-align: middle;
}
.timeline-wrapper h2 span {
  background: #f8c73e;
  color: #131313;
  letter-spacing: 0.1em;
  line-height: 1.7em;
  padding: 13px 5px 1px;
}
.timeline-series {
	background: rgba(51,51,51,.3);
  clear: left;
  float: left;
  margin: -14px 12px 0 0;
  padding: 14px 4px 4px 0;
  position: relative;
	border-top-right-radius: 8px;
	border-bottom-right-radius: 8px;
	border: 2px ridge rgba(192,192,192,.6);
	border-left: none;
  width: 600px;
}
.timeline-series dt {
  clear: left;
  font-size: 1.6em;
  list-style-type: none;
  line-height: 1.2em;
  margin: 0 0 12px;
  padding: 0 0 0 55px;
  white-space: nowrap;
	cursor: pointer;
}
.timeline-series dt a {
  color: #f8c73e;
  cursor: pointer;
}
.timeline-series dt a .closed {
  color: #999;
  font-size: 1em;
  margin-left: 0;
}
.timeline-series dt a .open {
  color: #f8c73e;
}
.timeline-series dt a:hover {
  color: #317bb6;
}
.timeline-series dd {
  padding-left: 24px;
  width: 100%;
}
.timeline-series dd h3 {
  color: #FFF;
  clear: both;
  float: left;
  font-size: 1.5em;
  margin: 0 15px 15px 0;
  white-space: pre-line;
}
.timeline-event-content {
  display: none;
}
.timeline-event-content p {
  clear: left;
  float: left;
  line-height: 1.5em;
  margin: 6px 0 10px;
	max-width: 500px;
}
.timeline-event-content h4 {
  clear: left;
  float: left;
  font-size: 1.4em;
  font-weight: 400;
  margin: 10px 0 0;
  padding: 0 0 0 20px;
}
.timeline-event-content blockquote {
  border-left: 2px solid #f8c73e;
  clear: left;
  float: left;
  font-size: 1.8em;
  margin-left: 0;
  padding: 0 30px;
  width: 400px;
}
.timeline-event-content blockquote .attribution {
  font-size: 0.7em;
  text-align: right;
}
.timeline-event-content .media {
  float: left;
	clear: both;
  padding: 0 0 12px;
  width: 300px;
}
.timeline-event-content .media img {
	clear: both;
  border: 2px solid #000;
  margin: 0;
}
.timeline-event-content .media p {
  font-size: 1.2em;
	clear: both;
  margin: 0;
  padding: 0;
}
.timeline-event-content .media a:link,
.timeline-event-content .media a:visited {
  color: #f8c73e;
}
.timeline-event-content .media a:hover {
  color: #317bb6;
}
h3 ~ p, .media ~ p {
	padding: 10px;
	background: rgba(51,51,51,.7);
	box-shadow: 8px 8px 6px (234,205,231,1);
	border-radius: 4px;
}
/*
    Colorbox Core Style:
    The following CSS is consistent between example themes and should not be altered.
*/
#colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:0; left:0; z-index:9999999; overflow:visible;}
#cboxOverlay{position:fixed; width:100%; height:100%;}
#cboxMiddleLeft, #cboxBottomLeft{clear:left;}
#cboxContent{position:relative;}
#cboxLoadedContent{overflow:auto; -webkit-overflow-scrolling: touch;}
#cboxTitle{margin:0;}
#cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%; height:100%;}
#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;}
.cboxPhoto{float:left; margin:auto; border:0; display:block; max-width:none; }
.cboxIframe{width:100%; height:100%; display:block; border:0;}
#colorbox, #cboxContent, #cboxLoadedContent{box-sizing:content-box;}

/*
    User Style:
    Change the following styles to modify the appearance of Colorbox.  They are
    ordered & tabbed in a way that represents the nesting of the generated HTML.
*/
#cboxOverlay{background:url(..img/overlay.png) repeat 0 0;}
#colorbox{outline:0;}
    #cboxTopLeft{width:21px; height:21px; background:url(../img/controls.png) no-repeat -101px 0;}
    #cboxTopRight{width:21px; height:21px; background:url(../img/controls.png) no-repeat -130px 0;}
    #cboxBottomLeft{width:21px; height:21px; background:url(../img/controls.png) no-repeat -101px -29px;}
    #cboxBottomRight{width:21px; height:21px; background:url(../img/controls.png) no-repeat -130px -29px;}
    #cboxMiddleLeft{width:21px; background:url(../img/controls.png) left top repeat-y;}
    #cboxMiddleRight{width:21px; background:url(../img/controls.png) right top repeat-y;}
    #cboxTopCenter{height:21px; background:url(../img/border.png) 0 0 repeat-x;}
    #cboxBottomCenter{height:21px; background:url(../img/border.png) 0 -29px repeat-x;}
    #cboxContent{background:#fff; overflow:visible;}
        .cboxIframe{background:#fff;}
        #cboxError{padding:50px; border:1px solid #ccc;}
        #cboxLoadedContent{margin-bottom:28px;}
        #cboxTitle{position:absolute; bottom:4px; left:0; text-align:center; font-size: 1.3em; width:100%; color:;}
        #cboxCurrent{position:absolute; bottom:4px; left:58px; color:#317bb6;}
        #cboxLoadingOverlay{background:url(../img/loading_background.png) no-repeat center center;}
        #cboxLoadingGraphic{background:url(../img/loading.gif) no-repeat center center;}

        /* these elements are buttons, and may need to have additional styles reset to avoid unwanted base styles */
        #cboxPrevious, #cboxNext, #cboxSlideshow, #cboxClose {border:0; padding:0; margin:0; overflow:hidden; width:auto; background:none; }

        /* avoid outlines on :active (mouseclick), but preserve outlines on :focus (tabbed navigating) */
        #cboxPrevious:active, #cboxNext:active, #cboxSlideshow:active, #cboxClose:active {outline:0;}

        #cboxSlideshow{position:absolute; bottom:4px; right:30px; color:#0092ef;}
        #cboxPrevious{position:absolute; bottom:0; left:0; background:url(../img/controls.png) no-repeat -75px 0; width:25px; height:25px; text-indent:-9999px;}
        #cboxPrevious:hover{background-position:-75px -25px;}
        #cboxNext{position:absolute; bottom:0; left:27px; background:url(../img/controls.png) no-repeat -50px 0; width:25px; height:25px; text-indent:-9999px;}
        #cboxNext:hover{background-position:-50px -25px;}
        #cboxClose{position:absolute; bottom:0; right:0; background:url(../img/controls.png) no-repeat -25px 0; width:25px; height:25px; text-indent:-9999px;}
        #cboxClose:hover{background-position:-25px -25px;}
				.CBmodal { font-size: 1.3em; color: #00E1E1; margin: 10px 0;}

/* UI */


input::-moz-focus-inner { border: 0; padding: 0; margin-top:-2px; margin-bottom: -2px; } 

/* Smartphones (landscape and portrait) ----------- */
@media screen and (max-width: 768px) {

    * {
        max-width: 720px;
    }

    body {
        font-size: normal;
    }

    .container {
       padding:10px;
    }

    div.timelineToggle {
       float:none;
    }

    .timelineEvent div.media {
        display:none;
        float:none;
    }

    .timelineMinor dt {
       font-size:1.2em;
       white-space: normal;
    }

    .timelineMinor dd h3 {
       font-size:1em;
       white-space: normal;
    }

    div#timelineContainer {
    }

    .timelineMinor dd {
        margin-left:20px;
        padding-left:0;
        width:100%;
    }

    .timelineEvent .media p {
       font-size:1em;
    }

    dl.timelineMinor {
       float:none;
       max-width:80%;
    }

    .timelineEvent p {
       float:none;
       width:100%;
    }

    .timelineEvent blockquote {
       float:none;
       width:200px;
       font-size:1em;
    }
}
 @media screen and (max-width:700px) {
   .timeline-container { max-width: 100%; }
 }
/* Smartphones (landscape and portrait) ----------- */
@media screen and (max-width: 540px) {

    * {
        max-width: 520px;
    }

    body {
        font-size: normal;
    }

    .container {
       padding:10px;
    }

    div.timelineToggle {
       float:none;
    }

    .timelineEvent div.media {
        display:none;
        float:none;
    }

    .timelineMinor dt {
       font-size:1.2em;
       white-space: pre-line;
    }

    .timelineMinor dd h3 {
       font-size:1em;
       white-space: pre-line;
    }

    div#timelineContainer {
    }

    .timelineMinor dd {
        margin-left:20px;
        padding-left:0;
        width:100%;
    }

    .timelineEvent .media p {
       font-size:1em;
    }

    dl.timelineMinor {
       float:none;
       max-width:80%;
    }

    .timelineEvent p {
       float:none;
       width:100%;
    }

    .timelineEvent blockquote {
       float:none;
       width:200px;
       font-size:1em;
    }
}
 @media screen and (max-width:500px) {
   .timeline-series { width: 100%; }
.bq, .bq span, .timeline-event-content p, .timeline-wrapper { width: 100%; }
 }
/* Smartphones (portrait) ----------- */
@media only screen and (max-width : 320px) {

    * {
        max-width: 300px;
    }

}

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title>HTL1942-2013</title>
	
  <link href='https://fonts.googleapis.com/css?family=Open+Sans:700' rel='stylesheet'>
  <style>
		.modalBox { background: none; color: #eee;}
		a.CBmodal.cboxElement.CBmodal.cboxElement { color: rgba(0,0,255,1); }
		a.CBmodal.cboxElement.CBmodal.cboxElement:hover, a.CBmodal.cboxElement.CBmodal.cboxElement:active { color: rgba(0,128,255,1); }
   
		.timeline-container {	top: 10em; }
    li { font-size: 1rem; }
    #colorbox, #cboxOverlay, #cboxWrapper{ position:fixed; top:0; left:0; z-index:9999; overflow:hidden; } 
    .ext { position: relative; bottom: -9em; height: 25%; border-left: 5px solid #fc3; margin-left: calc(50% - 300px);	margin-top: 5px; width: 0; overflow: hidden; } 
  </style>
</head>
<body>

	<div class="container">
  
  	<div class="banner">
    
    </div>
		
	</div>
		<div id="timeline" class="timeline-container">

			<button class="timeline-toggle"></button>
<br class="clear">
    
    <div class="timeline-wrapper">
				<h2 class="timeline-time"><button class="time">1</button></h2>
				<dl class="timeline-series">
					<dt id="1" class="timeline-event"><a>Title</a></dt>
					<dd class="timeline-event-content" id="1EX">
						<h3>Date</h3>
						<p>Text</p>
						<br class="clear">
					</dd><!-- /.timeline-event-content -->
				</dl><!-- /.timeline-series -->
			</div><!-- /.timeline-wrapper -->
<br class="clear">
    
    <div class="timeline-wrapper">
				<h2 class="timeline-time"><button class="time">2</button></h2>
				<dl class="timeline-series">
					<dt id="2" class="timeline-event"><a>Title</a></dt>
					<dd class="timeline-event-content" id="2EX">
						<h3>Date</h3>
						<p>Text</p>
						<br class="clear">
					</dd><!-- /.timeline-event-content -->
				</dl><!-- /.timeline-series -->
			</div><!-- /.timeline-wrapper -->
<br class="clear">
    
    <div class="timeline-wrapper">
				<h2 class="timeline-time"><button class="time">3</button></h2>
				<dl class="timeline-series">
					<dt id="3" class="timeline-event"><a>Title</a></dt>
					<dd class="timeline-event-content" id="3EX">
						<h3>Date</h3>
						<p>Text</p>
						<br class="clear">
					</dd><!-- /.timeline-event-content -->
				</dl><!-- /.timeline-series -->
			</div><!-- /.timeline-wrapper -->
<br class="clear">
    
    <div class="timeline-wrapper">
				<h2 class="timeline-time"><button class="time">4</button></h2>
				<dl class="timeline-series">
					<dt id="4" class="timeline-event"><a>Title</a></dt>
					<dd class="timeline-event-content" id="4EX">
						<h3>Date</h3>
						<p>Text</p>
						<br class="clear">
					</dd><!-- /.timeline-event-content -->
				</dl><!-- /.timeline-series -->
			</div><!-- /.timeline-wrapper -->
<br class="clear">
    
    <div class="timeline-wrapper">
				<h2 class="timeline-time"><button class="time">5</button></h2>
				<dl class="timeline-series">
					<dt id="5" class="timeline-event"><a>Title</a></dt>
					<dd class="timeline-event-content" id="5EX">
						<h3>Date</h3>
						<p>Text</p>
						<br class="clear">
					</dd><!-- /.timeline-event-content -->
				</dl><!-- /.timeline-series -->
			</div><!-- /.timeline-wrapper -->
<br class="clear">
    
    <div class="timeline-wrapper">
				<h2 class="timeline-time"><button class="time">6</button></h2>
				<dl class="timeline-series">
					<dt id="6" class="timeline-event"><a>Title</a></dt>
					<dd class="timeline-event-content" id="6EX">
						<h3>Date</h3>
						<p>Text</p>
						<br class="clear">
					</dd><!-- /.timeline-event-content -->
				</dl><!-- /.timeline-series -->
			</div><!-- /.timeline-wrapper -->

<br class="clear">
    
    <div class="timeline-wrapper">
				<h2 class="timeline-time"><button class="time">7</button></h2>
				<dl class="timeline-series">
					<dt id="7" class="timeline-event"><a>Title</a></dt>
					<dd class="timeline-event-content" id="7EX">
						<h3>Date</h3>
						<p>Text</p>
						<br class="clear">
					</dd><!-- /.timeline-event-content -->
				</dl><!-- /.timeline-series -->
			</div><!-- /.timeline-wrapper -->


		<br class="clear">
    
    <div class="timeline-wrapper">
				<h2 class="timeline-time"><button class="time">8</button></h2>
				<dl class="timeline-series">
					<dt id="8" class="timeline-event"><a>Title</a></dt>
					<dd class="timeline-event-content" id="8EX">
						<h3>Date</h3>
						<p>Text</p>
						<br class="clear">
					</dd><!-- /.timeline-event-content -->
				</dl><!-- /.timeline-series -->
			</div><!-- /.timeline-wrapper -->

			<br class="clear">
      <button class="timeline-toggle"></button>
	</div><!-- /#timelineContainer -->

<div class="ext"></div>

		<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.2/jquery.min.js"></script>
	<script src="https://technotarek.com/timeliner/js/timeliner.min.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.colorbox/1.6.4/jquery.colorbox-min.js"></script>
	<script>
		$(document).ready(function() {
			$.timeliner({
				oneOpen: true,
				startState: 'flat',
				expandAllText: '+ Show All',
				collapseAllText: '- Hide All'
			});
			// Colorbox Modal
			$(".CBmodal").colorbox({inline:true, initialWidth:100, maxWidth:685, initialHeight:100, transition:"elastic",speed:750});
				$(".iframe, .cboxIframe").colorbox({iframe:true, width:"90%", height:"100%" ,transition:"elastic",speed:750});

				
		$('a').click(function(e) {
			e.preventDefault();
		});
		$('.timeline-wrapper').on('click', function () {
				var self = this;
				setTimeout(function () {
                    // Tried a couple of ways to make xOffset a negative number.
					xOffset = $(self).offset();
					$('body, html').animate({
						scrollTop : xOffset.top
					});
				}, 910);
		});
});


	</script>

</body>
</html>

PLUNKER

最佳答案

所以您希望 timeline-wrapper div 的底部位于视口(viewport)的底部？我认为这样做:

$('.timeline-wrapper').on('click', function () {
    var self = this;
    setTimeout(function () {
        divOffset = $(self).offset().top;
        divHeight = $(self).height();
        viewportHeight = $(window).height();

        $('body, html').animate({
            scrollTop : divOffset + divHeight - viewportHeight
        });
    }, 910);
});

关于javascript - jQuery 或 JavaScript 中是否有等效的 ScrollBottom？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/37294663/

文章推荐： javascript - 将 jquery 添加到 React 入门工具包

文章推荐： c# - 如何检查多个参数的 null 或空字符串？ - C#

文章推荐： iphone:如何像 NSCalendar 一样混合枚举

javascript - 执行存在于输入值字段中的 javascript - JavaScript
我有一个 html 格式的表单: 我需要得到 JavaScript在value input 字段执行，但只能通过表单的 submit .原因是页面是一个模板所以我不控制它(不能有
javascript - JavaScript 代码片段正在破坏其他 JavaScript
我管理的论坛是托管软件，因此我无法访问源代码，我只能向页面添加 JavaScript 来实现我需要完成的任务。我正在尝试用超链接替换所有页面上某些文本关键字的第一个实例。我还根据国家/地区代码对这些
javascript - JavaScript 如何使新页面包含更多 JavaScript？
我正在使用 JS 打开新页面并将 HTML 代码写入其中，但是当我尝试使用 document.write() 在新页面中编写 JS 时功能不起作用。显然，一旦看到，主 JS 就会关闭。用于即将打开的
javascript - Javascript 引擎如何在浏览器中执行 Javascript？
提问不是为了解决问题，提问是为了更好地理解系统专家!我知道每当你将 javascript 代码输入 javascript 引擎时，它会立即由 javascript 引擎执行。由于没有看过Engi
javascript - 如何将 JavaScript 变量从一个 JavaScript 文件传递到另一个 JavaScript 文件？
我在一个文件夹中有两个 javascript 文件。我想将一个变量的 javascript 文件传递到另一个。我应该使用什么程序？最佳答案 window.postMessage用于跨文档消息。使
javascript - javascript 中的 javascript 输入问题
我有一个练习，我需要输入两个输入并检查它们是否都等于一个。如果是 console.log 正则 console.log false 我试过这样的事情: function isPositive(fir
javascript - 在加载其他 javascript 库的页面上嵌入 Javascript？
我正在做一个Web应用程序，计划允许其他网站(客户端)在其页面上嵌入以下javascript: 我的网络应用程序位于 http://example.org 。我不能假设客户端网站的页面有 JQue
javascript - 从 Javascript 内部调用 Javascript
目前我正在使用三个外部 JS 文件。我喜欢将所有三个 JS 文件合而为一。尽一切可能。我创建 aio.js 并在 aio.js 中 src="https://code.jquery.com/
javascript - AngularJS/javascript javascript 对象的特殊排序顺序
我有例如像这样的数组: var myArray = []; var item1 = { start: '08:00', end: '09:30' } var item2 = {
javascript - 在 Javascript 内部执行 Javascript？
所以我正在制作一个 Chrome 扩展，它使用我制作的一些 TamperMonkey 脚本。我想要一个“主”javascript 文件，您可以在其中包含并执行其他脚本。我很擅长使用以下行将其他 jav
javascript - 如何将变量从 javascript 移动到 javascript？
我有 A、B html 和 A、B javascript 文件。并且，如何将 A JavaScript 中使用的全局变量直接移动到 B JavaScript 中？示例 JavaScript) va
javascript - 从 javascript 调用 javascript
我需要将以下整个代码放入名为 activate.js 的 JavaScript 中。你能告诉我怎么做吗？ var int = new int({ seconds: 30, mark
javascript - 将变量值从一个 JavaScript 传递到另一个 JavaScript
我已经为我的 .net Web 应用程序创建了母版页 EXAMPLE1.Master。他们的 I 将值存储在 JavaScript 变量中。我想在另一个 JS 文件中检索该变量。示例1.大师:-
javascript - 有没有开源库可以在浏览器中使用 Javascript 来整理 Javascript？
是否有任何库可以用来转换这样的代码: function () { var a = 1; } 像这样的代码: function () { var a = 1; } 在我的浏览器中。因为我在 Gi
javascript - javascript 中的参数列表后缺少语法 javascript 错误 )
我收到语法缺失 ) 错误 $(document).ready(function changeText() { var p = document.getElementById('bidp
javascript - 第一个 JavaScript 完成后启动第二个 JavaScript
我正在制作进度条。它有一个标签。我想调整某个脚本完成的标签。在找到可能的解决方案的一些答案后，我想出了以下脚本。第一个启动并按预期工作。然而，第二个却没有。它出什么问题了？代码如下: HTML:
javascript - 为什么外部 javascript 库会阻止我页面上的 javascript？
这里有一个很简单的问题，我简单的头脑无法回答:为什么我在外部库中加载时，下面的匿名和onload函数没有运行？我错过了一些非常非常基本的东西。 Library.js 只有一行:console.log(
javascript - 如何区分代码内 javascript 和客户端 javascript
我知道 javascript 是一种客户端语言，但如果实际代码中嵌入的 javascript 代码以某种方式与在控制台上运行的代码不同，我会尝试找到答案。让我用一个例子来解释它: 我想创建一个像 Mi
javascript - 将 Javascript 内联到不显眼的 JavaScript？
我如何将这个内联 javascript 更改为 Unobtrusive JavaScript？谢谢! 感谢您的回答，但它不起作用。我的代码是: PHP js文件 document.getElem
javascript - 如何将 JavaScript 对象导出为 JavaScript？
我正在寻找将简单的 JavaScript 对象“转储”到动态生成的 JavaScript 源代码中的最优雅的方法。目的:假设我们有 node.js 服务器生成 HTML。我们在服务器端有一个对象x。

行者123

个人简介

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

作者热门文章

滴滴打车优惠券免费领取

全站热门文章

首页

博学

6Ren·AI

商城

javascript - jQuery 或 JavaScript 中是否有等效的 ScrollBottom？

已解决

片段