个人中心
文章发布
退出
作者热门文章
- android - RelativeLayout 背景可绘制重叠内容
- android - 如何链接 cpufeatures lib 以获取 native android 库？
- java - OnItemClickListener 不起作用，但 OnLongItemClickListener 在自定义 ListView 中起作用
- java - Android 文件转字符串
26
4
我已经找到并调整了代码，可以使一个句子以正弦方式逐个字母地动画化。但是，存在一些问题:
Here is the link这是代码
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
</head>
<body>
<div id="options">
<ul id="list" style="">
<li>ABOUT</li>
</br>
<li>THE STREAM</li>
</br>
<li>TELL YOUR STORY</li>
</br>
<li>COMING EVENTS</li>
</br>
<li>CONTACT</li>
</ul>
</div>
<div id="sentences_block">
<div id="elements" style="margin-left:50px;"></div>
<div>
</body>
<style type="text/css">
.letter {
font-family: sans-serif;
font-size: 40px;
font-weight: bold;
position: absolute;
top: -100px;
left: 0px;
}
#list {
list-style-type: none;
color: #0067CE;font-weight: bold;
font-style:arial;
font-size:15px;
float:right;
}
#options {
margin-right:20px;
}
</style>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
$(document).ready(function() {
var width = $(window).width() - 0;
var starttime = new Date().getTime();
var letters = document.location.hash ? document.location.hash.substr(1) : 'sentence';
var elements = $('#elements');
for (i = 0; i < letters.length; i++) {
$('<div>', {
html: letters[i]
})
.addClass('letter')
.appendTo(elements);
}
function run() {
var elapsed = new Date().getTime() - starttime;
var pos = elapsed * 0.2;
$('div.letter').each(function(index, letter) {
var posx = (pos + 40 * index) % width;
var posy = 200 + Math.sin(posx / 50) *25;
$(letter).css('left', posx + 'px');
$(letter).css('top', posy + 'px');
});
}
setInterval(run, 3);
});
</script>
</html>
最佳答案
多个句子的一个解决方案是让每个字母 div 高几行。您需要计算字母元素的最大数量并保持每个句子的长度相同，但是使用空格可以得到几乎任何您想要的句子，同时保持您的实际代码结构。像这样:
var letters = document.location.hash ? document.location.hash.substr(1) : 'sentence';
var line_2 = document.location.hash ? document.location.hash.substr(1) : 'another ';
var line_3 = document.location.hash ? document.location.hash.substr(1) : ' again ';
$('<div>', {
html: letters[i]+'<br>'+line_2[i]+'<br>'+line_3[i]
})
对于宽度，我不太清楚，但是如果你想让动画在选项开始的地方停止，选项的宽度可以通过加上#list的宽度加上 margin ，加上填充。或者，更简单地说，动画的宽度可以等于列表的左偏移量。像这样:
var width = $('#list').offset().left
关于javascript - 几个句子/文本正弦波Jquery动画，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/30449000/
26
4
0
假设我有一个数据集，每行包含一个句子，该句子来自一个非常大的调查(德语和法语)中的一个开放式问题。大多数句子(答案)是合乎逻辑的；即有意义的单词组合。但是，也有一些粗心的受访者只是简单地填写了各种不合
我的 MySQL 数据库中有一个表，其结构如下: CREATE TABLE `papers` ( `id` int(11) NOT NULL AUTO_INCREMENT, `title` varch
在新的 Edge 浏览器(基于 chromium)中，有一个文本到语音的选项，在阅读页面时它会突出显示正在阅读的句子和单词，就像这样 - 过去我有一个简单的 Windows TTS 应用程序，我通过将
我有一本书的图像文件。我正在编写一个 Web 应用程序，用于加载书籍并一次显示一页。我想知道如何在页面中选择一个句子并显示一条消息。据我所知，它必须具有图像坐标。 请参阅http://epaper.d
我使用的 GPS 输出多个 NMEA 语句，可用于定位数据。 (GPGGA 和 GPRMC)。有什么理由我应该使用一个而不是另一个吗？我应该检查它们并比较数据吗？我可以随便挑一个使用吗？ 在这一点上，
我想使用TinyGPS++在 Arduino 上解析 NMEA 数据并在 OLED 显示屏上显示信息。但是，NMEA 数据将通过 USB 接收，而不是使用软件串行和 TX/RX 引脚。 我按照 Tin
我需要删除其中的所有空格。 例如:这是我的代码O/P:Thisismycode 这是我到目前为止的代码。 import java.util.Scanner; public class nospace{
我对 python 很陌生，我不知道如何解决以下问题: 我有两个数据框，我想使用某种 VLOOKUP 函数来将句子与特定关键字相匹配。在下面的示例中，(df1) 3e 句子应与“banana”(df2
这个问题已经有答案了: How slicing in Python works (38 个回答) Python list slice syntax used for no obvious reason
我想在我的表格作者的句子列中找到以 # 开头的单词。我不知道我在寻找什么词，因为我只知道它以 # 开头。 表:作者(姓名，句子) 作者 |句子 艾伯特 |我#want to be #discussin
句子
关闭。这个问题需要details or clarity .它目前不接受答案。 想改进这个问题吗？ 通过 editing this post 添加细节并澄清问题. 关闭 9 年前。 Improve
我目前正在经历免费代码营的第一个 JS 挑战。 我在标题为“句子首字母大写”的挑战中遇到了问题。在这个挑战中，我需要编写一个函数，将给定字符串中单词的每个第一个字母大写，并将所有其他字母小写。 Her
假设我有一个文本，看起来像这样: Some sentence in which a fox jumps over some fence. Another sentence in which a
我是 C++ 的初学者，我想了解有关字符的更多信息，但我遇到了问题。我试图制作一个程序，它复制一个句子并在空格 (' ') 之间添加一个新行 ('\n')，就像一个单词一个单词地分开一个句子. int
我需要将一个句子(例如“Hello world”)复制到一个字符串列表中，意思是复制到一个字符数组中，其中每 2 个单词由 '\0' 分隔。请注意，单词被定义为一行中没有空格的任意数量的字符。 因此，
我有这样一个字符串， my_str ='·in this match, dated may 1, 2013 (the "the match") is between brooklyn centenni
我在列表中有一堆句子，我想使用 nltk 库来阻止它。我可以一次提取一个句子，但是我在从列表中提取句子并将它们重新组合在一起时遇到了问题。我缺少一个步骤吗？ nltk 库很新。谢谢! import n
我有一个词和文本。我必须找到所有包含该词的提案。你有什么想法吗？ piblic List GetSnetences(string word) { // search all proposals
我正在通过 doc2vec 模型使用 gensim 库在 Python 中构建 NLP 聊天应用程序。我有硬编码的文档并给出了一组训练示例，我通过抛出用户问题来测试模型，然后第一步找到最相似的文档。在
我有以下代码，每 10 个单词拆分一行。 #!/bin/bash while read line do counter=1; for word in $line do
我是一名优秀的程序员,十分优秀！