我有一个jquery股票代码,我不能在同一页面上复制股票代码。我的想法是在同一页面上创建一个类似的股票代码,但有一个不同的股票列表。它可能就像更改一些变量名一样简单,或者因为API导致冲突而可能遇到问题。
我花了很多时间在上面,所以任何建议让这项工作真的很有帮助。
附件是我试图复制的股票代码的JSfiddle。如果有人可以在同一页面上复制这个股票代码,但只说几股,那么这对我有很大帮助。
请在此处查看我的JSfiddle:https://jsfiddle.net/90s6vd8z/1/
$scope.updateCenter = function(center) {
$scope.center = center
$("#centerModal").modal("show")
};
答案 0 :(得分:0)
这个自动收报机只有12个选项。我所做的是减少卷轴的高度,动画的速度和div的数量
https://jsfiddle.net/RachGal/p6nofz00/
var gstock = ["NASDAQ:ASTE", "STO:ATCO-A", "JSE:BEL", "BIT:CNHI", "NYSE:DE", "KRX:042670", "EPA:PIG", "TYO:6305", "KRX:009540", "TYO:5406", "TYO:6301", "TYO:6326"];
$(document).ready(function () {
for (var i = 0; i < gstock.length; i++) {
$.getJSON("https://finance.google.com/finance/info?client=ig&q=" + gstock[i] + "&callback=?", function (response) {
var stockInfo1 = response[0];
var divContainer = $('*[data-symbol="' + stockInfo1.t + '"]');
var divCurrency = $('*[data-currency="' + stockInfo1.d + '"]');
var percentStock = !isNaN(stockInfo1.c) && !isNaN(stockInfo1.l) && stockInfo1.l ? ((parseFloat(stockInfo1.c)/parseFloat(stockInfo1.l)) * 100) : undefined;
var stockString1 = '<div class="stockWrapper">' + divContainer.data('title') + ':';
var stockName1 = stockInfo1.t;
var stockCurency1 = stockInfo1.d;
var stockPrice2 = "";
stockPrice2 += '<span class="stockSymbol "> ' + stockInfo1.l + '</span>';
var stockChange = "";
stockString1 += '<span class="stockSymbol "> ' + stockInfo1.t + ' </span>';
if(!isNaN(percentStock) && percentStock > 0) {
percentStock = Number((percentStock).toFixed(2));
stockChange += '<span class="stockChange "> ' + percentStock + ' %</span>';
} else if(!isNaN(percentStock)) {
percentStock = Number((percentStock).toFixed(2));
stockChange += '<span class="stockPrice "> ' + percentStock + ' %</span>';
} else {
stockChange += '<span class="stockPrice "></span>';
stockChange += percentage + '% </span>';
}
stockString1 += stockChange + '</div>';
$("#title").append("<div>" + divContainer.data('title') + "</div>");
$("#symbols").append("<div><b>" + stockInfo1.t + "</b></div>");
$("#currency").append("<div><b>" + $(divContainer).attr( 'data-currency') + "</b></div>");
$("#livePrice").append("<div>" + stockPrice2 + "</div>");
$("#liveData").append("<div>" + stockChange + "</div>");
divContainer.append(stockString1);
});
}
});
&#13;
.box {
width: 100%;
display: block;
padding-top: 5px;
font-family:"HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
font-weight: 300;
}
.stockSymbolnew {
}
.stockWrapper {
text-indent: -1000em;
display: block;
padding-top: 5px;
font-family:"HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
font-weight: 300;
}
.stockSymbol {
font-weight: 600;
}
.stockPrice {
font-weight: 600;
color: red;
}
.stockChange {
font-weight: 600;
color: green;
}
.stockTime {
font-weight: 600;
color: grey;
font-size: smaller;
}
.symbol {
float: left;
margin-right: 0px;
}
.symbol .name {
display: block
}
.symbol.up {
background: #70DB70
}
.symbol.up .change {
color: green
}
.symbol.down {
background: #f7cdc2
}
.symbol.down .change {
color: red
}
.floatleft2 {
float:left;
display: block;
padding-top: 5px;
font-family:"HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
font-weight: 300;
font-size: 12px;
width: 130px;
}
.floatleft999 {
float:left;
display: block;
padding-top: 5px;
font-family:"HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
font-weight: 300;
font-size: 12px;
width: 35px;
}
.floatleft20 {
float:left;
display: block;
padding-top: 5px;
font-family:"HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
font-weight: 300;
font-size: 12px;
width: 50px;
}
.floatleft9 {
float:left;
display: block;
padding-top: 5px;
font-family:"HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
font-weight: 300;
font-size: 12px;
width: 45px;
}
#verticalScroller {
position: absolute;
width:268px;
height: 50px;
border: 0px solid red;
overflow: hidden;
}
#verticalScroller > div {
position:absolute;
width:268px;
height:50px;
border: 0px solid blue;
overflow:hidden;
}
div.marquee > div > div > div:nth-child(odd) {
background: #eee;
}
div.marquee > div > div > div {
margin-right: -6px;
}
&#13;
<script src="https://code.jquery.com/jquery-2.1.4.js"></script>
<div class="container">
<div class="marquee">
<div class="1" data-symbol="ASTE" data-title="ASTEC IND" style="display: none;" data-currency="USD" ></div>
<div class="2" data-symbol="ATCO-A" data-title="ATLAS COPCO" data-currency="SEK" style="display: none;"></div>
<div class="3" data-symbol="BEL" data-title="BELL EQUIPMENT" data-currency="GBP" style="display: none;"></div>
<div class="4" data-symbol="CAT" data-title="CAT" data-currency="GBP" style=" display: none;"></div>
<div class="5" data-symbol="CNHI" data-title="CHN INDUSTRIAL" data-currency="EUR" style="display: none;"></div>
<div class="6" data-symbol="DE" data-title="DEERE" data-currency="USD" style="display: none;"></div>
<div class="7" data-symbol="042670" data-title="DOOSAN" data-currency="GBP" style="display: none;"></div>
<div class="8" data-symbol="PIG" data-title="HAULOTTE" data-currency="EUR" style="display: none;"></div>
<div class="9" data-symbol="6305" data-title="HIACHI" data-currency="GBP" style="display: none;"></div>
<div class="10" data-symbol="009540" data-title="HYUNDAI " data-currency="GBP" style="display: none;"></div>
<div class="12" data-symbol="5406" data-title="KOBE STEEL" data-currency="JPY" style="display: none;"></div>
<div class="box">
<div id="title" class="floatleft2"></div>
<div id="currency" class="floatleft999"></div>
<div id="livePrice" class="floatleft20"></div>
<div id="liveData" class="floatleft9"></div>
</div></div>
</div>
&#13;