我正在尝试在我的主页上使用键入的文本。我添加了html和js代码和脚本,但它不起作用。它只显示3个引号,它应该一次显示一个引号。以下是我的代码,任何帮助将不胜感激。
Index.cshtml
<div class="container">
<div class="agile_banner_info">
<div class="agile_banner_info1">
<h3>Welcome To <span>Business</span></h3>
<div id="typed-strings" class="agileits_w3layouts_strings"> @*The following text should have the typing effect*@
<p>Global leaders <i>in Business Process</i> and Enterprise Content Management</p>
<p>Business <i>efficiency</i> through BPM</p>
<p>Increasing <i>productivity.</i> Take informed decisions</p>
</div>
<span id="typed" style="white-space:pre;"></span>
</div>
<div class="banner_agile_para">
<p>Our aim is to help our customers succeed</p>
</div>
<div class="wrapper-inner-tab-backgrounds">
<div class="wrapper-inner-tab-backgrounds-first"><a href="single.html"><div class="sim-button button17">Read More</div></a></div>
</div>
</div>
</div>
<script src="~/Content/MyTemplate/js/typed.js" type="text/javascript"></script>
<script>
$(function () {
$("#typed").typed({
stringsElement: $('#typed-strings'),
typeSpeed: 30,
backDelay: 500,
loop: false,
contentType: 'html',
loopCount: false,
callback: function () { foo(); },
resetCallback: function () { newTyped(); }
});
$(".reset").click(function () {
$("#typed").typed('reset');
});
});
function newTyped() { /* A new typed object */ }
function foo() { console.log("Callback"); }
</script>
答案 0 :(得分:0)
我在脚本中添加了您的文字并注释掉HTML内容。希望这会对你有所帮助。
$(function(){
$("#typed").typed({
strings: ["Global leaders <i>in Business Process</i> and Enterprise Content Management", "Business <i>efficiency</i> through BPM","Increasing <i>productivity.</i> Take informed decisions"],
typeSpeed: 110, // typing speed
backDelay: 500, // pause before backspacing
loop: true,
});
});
&#13;
<div class="container">
<div class="agile_banner_info">
<div class="agile_banner_info1">
<h3>Welcome To <span>Business</span></h3>
<!-- <div id="typed-strings" class="agileits_w3layouts_strings"> @*The following text should have the typing effect*@
<p>Global leaders <i>in Business Process</i> and Enterprise Content Management</p>
<p>Business <i>efficiency</i> through BPM</p>
<p>Increasing <i>productivity.</i> Take informed decisions</p>
</div>
-->
<span id="typed" style="white-space:pre;"></span>
</div>
<div class="banner_agile_para">
<p>Our aim is to help our customers succeed</p>
</div>
<div class="wrapper-inner-tab-backgrounds">
<div class="wrapper-inner-tab-backgrounds-first"><a href="single.html"><div class="sim-button button17">Read More</div></a></div>
</div>
</div>
</div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.0.0-alpha1/jquery.min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/typed.js/1.1.1/typed.min.js"></script>
&#13;