Ayaz Memon
Ayaz Memon

Reputation: 15

LESS client side

I'm trying to get this fiddle to work locally. It does not render properly. I've no idea why. The linked .less file is copied directly from the fiddle. The result of my markup is a blank page. I opted to use the CDN because when I downloaded the source I was unsure which less.js file to copy.

Here's the markup:

<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>radial-progress</title>
<link rel="stylesheet/less" type="text/css" href="styles/radial-progress.less">
<script src="//cdnjs.cloudflare.com/ajax/libs/less.js/2.5.1/less.min.js"></script>
</head> 
<body>
    <div class="radial-progress" data-progress="0">
        <div class="circle">
            <div class="mask full">
                <div class="fill"></div>
            </div>
            <div class="mask half">
                <div class="fill"></div>
                <div class="fill fix"></div>
            </div>
            <div class="shadow"></div>
        </div>
        <div class="inset">
            <div class="percentage"></div>
        </div>
</div>
<script>
$('head style[type="text/css"]').attr('type', 'text/less');
less.refreshStyles();
window.randomize = function() {
$('.radial-progress').attr('data-progress', Math.floor(95));}
    setTimeout(window.randomize, 200);
    $('.radial-progress').click(window.randomize);
</script>
</body>
</html>

Upvotes: 0

Views: 112

Answers (1)

epascarello
epascarello

Reputation: 207501

My guess is you are running off the C: drive instead of a local server so the relative protocol link is breaking.

src="//cdnjs..."

needs to be

src="http://cdnjs..."

Better yet look into running your own server. It is simple with python or node.

Upvotes: 1

Related Questions