Виджеты курса криптовалют

Sm1Le

Проверенные
Сообщения
451
Решения
4
Реакции
1,314
Баллы
5,830
Эти 3 виджета без автообновления.

HTML Виджет курса биткоина (одиночный)
Посмотреть вложение 123010
HTML:
<script>
!function(){var e;if(void 0===window.jQuery||"1.4.2"!==window.jQuery.fn.jquery){var t=document.createElement("script");t.setAttribute("type","text/javascript"),t.setAttribute("src","https://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"),t.readyState?t.onreadystatechange=function(){"complete"!=this.readyState&&"loaded"!=this.readyState||n()}:t.onload=n,(document.getElementsByTagName("head")[0]||document.documentElement).appendChild(t)}else e=window.jQuery,i();function n(){e=window.jQuery.noConflict(!0),i()}
function i(){e(document).ready(function(e){e(".coinlore-coin-widget").each(function(){var width;var bwidth;var color;var symbol='';var divnum=0;var rank=e(this).attr("data-rank");var mcap=e(this).attr("data-mcap");var d7=e(this).attr("data-d7");var vol=e(this).attr("data-vol");var cwidth=e(this).attr("data-cwidth");var bcolor=e(this).attr("data-bcolor");var tcolor=e(this).attr("data-tcolor");var ccolor=e(this).attr("data-ccolor");var pcolor=e(this).attr("data-pcolor");e.get("https://widget.coinlore.com/widgets/new-single/?id="+e(this).attr("data-id")+"&cur="+e(this).attr("data-mcurrency"),function(t){cc='<div style="color:'+tcolor+';font-family: Helvetica,Arial,sans-serif;min-width:215px; width:'+cwidth+'">';cc+='<div><div style="float:right;width:67%;border: none;text-align:left;padding:5px 0px;line-height:25px;">';cc+='<span style="font-size: 17px;"><a href="https://www.coinlore.com/coin/'+t[0].nameid+'" target="_blank" style="text-decoration: none; color: '+ccolor+';font-weight: bold">'+t[0].name+'</a><span style="font-size: 10px;padding-left: 5px">'+t[0].symbol+'</span></span>';if(t[0].percent_change_24h<0){color='#c2220d!important';}else{color='#8dc647!important';symbol='+';}
cc+='<div style="font-size: 15px;color:'+pcolor+';position: absolute">'+t[0].price_usd+' '+t[0].mc+' <span style="color:'+color+'">('+symbol+t[0].percent_change_24h+')</span></div>';cc+='</div>';cc+='<div style="text-align:center;padding:5px 0px;width:33%;"><img src="https://c2.coinlore.com/img/'+t[0].nameid+'.png" width="64px" height="64px" style="margin: 0 auto;padding-inline: 6px;padding-top: 1px"></div>';cc+='</div>';if(rank==1)divnum+=1;if(mcap==1)divnum+=1;if(d7==1)divnum+=1;if(vol==1)divnum+=1;bwidth=(100/divnum);if(rank==1){cc+='<div style="text-align:center;float:left;width:'+bwidth+'%;font-size:12px;padding:12px 0;border-right:1px solid #e1e5ea;line-height:1.25em;"><b>Rank</b><br><br><span style="font-size: 17px; ">'+t[0].rank+'</span></div>';}
if(mcap==1){cc+='<div style="text-align:center;float:left;width:'+bwidth+'%;font-size:12px;padding:12px 0 16px 0;border-right:1px solid #e1e5ea;line-height:1.25em;"><b>Market Ca</b>p<br><br> <span style="font-size: 14px; ">'+t[0].market_cap_usd+' <span style="font-size:9px">USD</span></span></div>';}
if(vol==1){cc+='<div style="text-align:center;float:left;width:'+bwidth+'%;font-size:12px;padding:12px 0 16px 0;line-height:1.25em;border-right:1px solid #e1e5ea;"><b>Vol (24H)</b><br><br> <span style="font-size: 14px; ">'+t[0].t24h_volume_usd+' <span style="font-size:9px">USD</span></span></div>';}
symbol='';if(t[0].percent_change_7d<0){color='#c2220d!important';}else{color='#8dc647!important';symbol='+';}
if(d7==1){cc+='<div style="text-align:center;float:left;width:'+(bwidth-1)+'%;font-size:12px;padding:12px 0 16px 0;line-height:1.25em;"><b>7D Change</b><br><br> <span style="font-size: 14px;color: '+color+';>'+symbol+t[0].percent_change_7d+'<span style="font-size:9px">%</span></span></div>';}
cc+='</div>';cc+='</div>';e(".coinlore-coin-widget").css("width",width);e(".coinlore-coin-widget").html(cc);})})})}}();
</script>
<script type="text/javascript" ></script><div class="coinlore-coin-widget" data-mcap="0" data-mcurrency="usd" data-d7="0" data-cwidth="0" data-rank="0" data-vol="0" data-id="bitcoin" data-bcolor="black" data-tcolor="grey" data-ccolor="white" data-pcolor="darkgrey"></div>

Чтобы изменить криптовалюту, введите название на английском языке в конце кода data-id="bitcoin" на data-id="ethereum" или любую другую.


Мультивалютный HTML виджет
Посмотреть вложение 123011
HTML:
<script>
!function () {
    var e;
    if (void 0 === window.jQuery || "1.4.2" !== window.jQuery.fn.jquery) {
        var t = document.createElement("script");
        t.setAttribute("type", "text/javascript"), t.setAttribute("src", "https://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"), t.readyState ? t.onreadystatechange = function () {
            "complete" != this.readyState && "loaded" != this.readyState || n()
        } : t.onload = n, (document.getElementsByTagName("head")[0] || document.documentElement).appendChild(t)
    } else e = window.jQuery, i();

    function n() {
        e = window.jQuery.noConflict(!0), i()
    }

    function i() {
        e(document).ready(function (e) {
            var width;
            var color;
            var symbol = '';
            var mc_text = '';
            var bcolor = '';
            var ccolor = '';
            var pcolor = '';
            var mcap = '';
            var adtd = '';
            e(".coinlore-list-widget").each(function () {
                bcolor = e(this).attr("data-bcolor");
                pcolor = e(this).attr("data-pricecolor");
                ccolor = e(this).attr("data-coincolor");
                mcap = e(this).attr("data-mcap");

                e.get("https://widget.coinlore.com/widgets/top-list/?top=" + e(this).attr("data-top") + "&cur=" + e(this).attr("data-mcurrency"), function (t) {
                    cc = '<table width="100%" style="border-radius: 10px;font-family: sans-serif;background:' + bcolor + '">';
                    t.forEach(function (entry) {
                        cc += '<tr>';
                        cc += '<td style="text-align: left;padding: 5px;border-bottom: 1px solid #c0c0c05c;height: 20px;"><img src="https://c1.coinlore.com/img/20x20/' + entry.nameid + '.png">' +
                            ' <a href="https://www.coinlore.com/coin/' + entry.nameid + '" style="font-weight: 700;position: absolute; padding-left: 4px;font-size: 13px;padding-top:4px;margin: 0;overflow-x: hidden;color:' + ccolor + ';text-decoration: none;background-color: transparent;">' + entry.name + '</a></td>';

                        if (mcap == 1) {
                            cc += '<td style="text-align: center;padding: 5px;border-bottom: 1px solid #c0c0c05c;height: 20px;color:' + pcolor + ';white-space: nowrap;font-weight: 700;padding: 5px;border-bottom: 1px solid #c0c0c05c;height: 20px;">' + entry.market_cap_usd + '</td>'
                        }
                        cc += '<td style="color:' + pcolor + ';white-space: nowrap;font-weight: 700;text-align: right;padding: 5px;border-bottom: 1px solid #c0c0c05c;height: 20px;">' + entry.price_usd;
                        symbol = '';
                        if (entry.percent_change_24h < 0) {
                            color = '#c2220d!important';
                        } else {
                            color = '#8dc647!important';
                            symbol = '+';
                        }

                        cc += '(<span style="font-weight: 300;color:' + color + '">' + symbol + entry.percent_change_24h + '%</span>)'
                        cc += '</td>';
                        cc += '</tr>';
                        mc_text = entry.mc;
                    });
                    if (mcap == 1) {
                        adtd = '<td></td>';
                    }
                    cc += '</table>';

                    e(".coinlore-list-widget").css("width", width);
                    e(".coinlore-list-widget").html(cc);
                })

                if (e(this).attr("data-cwidth") > 0) {
                    if (e(this).attr("data-cwidth") < 160) {
                        width = '230px';
                    } else {
                        width = e(this).attr("data-cwidth") + 'px';
                    }
                } else {
                    width = '100%';
                }
            })
        })
    }
}();
</script>
<script type="text/javascript"></script><div class="coinlore-list-widget" data-mcap="0" data-mcurrency="usd" data-top="10" data-cwidth="0.5" data-bcolor="none" data-coincolor="grey" data-pricecolor="darkgrey" style="width: 160px;"></div>
Мультивалютный виджет поддерживает увеличение и уменьшение количества криптовалют, для этого измените значение в последней строке data-top="10" на нужное количество (например 2 - будет отображаться только биток и эфир)

HTML Виджет "Бегущая строка"
Посмотреть вложение 123015

HTML:
<script>
!function(){var e;if(void 0===window.jQuery||"1.4.2"!==window.jQuery.fn.jquery){var t=document.createElement("script");t.setAttribute("type","text/javascript"),t.setAttribute("src","https://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"),t.readyState?t.onreadystatechange=function(){"complete"!=this.readyState&&"loaded"!=this.readyState||n()}:t.onload=n,(document.getElementsByTagName("head")[0]||document.documentElement).appendChild(t)}else e=window.jQuery,i();function n(){e=window.jQuery.noConflict(!0),i()}
function i(){e(document).ready(function(e){var width;var color;var symbol='';var mc_text='';var bcolor='';var ccolor='';var pcolor='';var mcap='';var adtd='';e(".coinlore-priceticker-widget").each(function(){bcolor=e(this).attr("data-bcolor");pcolor=e(this).attr("data-pcolor");ccolor=e(this).attr("data-ccolor");scolor=e(this).attr("data-scolor");e.get("https://widget.coinlore.com/widgets/top-list/?top="+e(this).attr("data-top")+"&cur="+e(this).attr("data-mcurrency"),function(t){cc='<style>.marqueecoinlore{width:100%;margin:0 auto;overflow:hidden;white-space:nowrap;box-sizing:border-box;animation:marquee 50s linear infinite}.marqueecoinlore:hover{animation-play-state:paused}@keyframes marquee{0%{text-indent:27.5em}100%{text-indent:-105em}}</style>';cc+='<div style="color: #333;background: '+bcolor+';font-family: Helvetica,Arial,sans-serif;min-width: 300px;width: 100%;line-height: 35px;font-size: 16px;">';cc+='<div class="marqueecoinlore">';t.forEach(function(entry){symbol='';if(entry.percent_change_24h<0){color='#c2220d!important';}else{color='#8dc647!important';symbol='+';}
cc+='<a style="padding-left: 10px;padding-right: 10px;" href="https://www.coinlore.com/coin/'+entry.nameid+'" target="_blank">\n'+
'<img style="vertical-align: sub; border-style: none;padding:2px;-webkit-box-align: center; -ms-flex-align: center; align-items: center;width: 20px;height: 20px;" src="https://c1.coinlore.com/img/20x20/'+entry.nameid+'.png">\n'+
'<span style="color: '+ccolor+'">'+entry.name+'</span> <span style="color: '+scolor+'">('+entry.symbol+')</span>\n'+
'<span style="color: '+pcolor+';">'+entry.price_usd+'<span style="font-size: 10px">'+entry.mc+'</span></span><span style="color:'+color+'"> ('+symbol+''+entry.percent_change_24h+'%) </span>\n'+
'</a>';});cc+='</div>';cc+='</div>';e(".coinlore-priceticker-widget").css("width",width);e(".coinlore-priceticker-widget").html(cc);})})})}}();
</script>
<script type="text/javascript"></script><div class="coinlore-priceticker-widget" data-mcurrency="usd" data-bcolor="none" data-scolor="darkgrey" data-ccolor="white" data-pcolor="grey"></div>

Создаете виджет без расширенного режима, с данным говнокодом и получаете сие искусство.
Цвета текста, размер и валюту для виджета менять в самом конце кода, можно использовать хэштег коды для цветов.
Работает как на белом так и на черном стиле (прозрачный цвет заднего фона).



Этот виджет с онлайн трансляцией

HTML виджет "Бегущая строка"
Посмотреть вложение 123018
Настроить и взять код можно тут

Другие live виджеты пока не нашёл. Не стесняйтесь поделиться в теме.
 
Последнее редактирование:
А может Вы всё же оформите по нормальному через "Ресурсы"?
 
Современный облачный хостинг провайдер | Aéza
Назад
Сверху Снизу