Cufon… Simple gradient text… isn't working

StackOverflow https://stackoverflow.com/questions/12119209

Question

I've been trying for hours to figure out why this won't work... I don't understand, it's not complicated at all, I've stripped it completely clean. Why isn't it working??

I'm trying to turn h1 text into gradient text...

http://jsfiddle.net/aZsUh/1/

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />

<title>TITLE</title>

<!-- StyleSheet -->  
<link id="stylesheet" type="text/css" href="css/style.css" rel="stylesheet" />

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script type="text/javascript" src="js/cufon-yui.js"></script>

<script type="text/javascript">
Cufon.replace('h1', {
color: '-linear-gradient(#999, 0.45=#666, 0.45=#555, #999)'
});
</script>

</head>

<body>
<h1>Lorem ipsum dolor seiti alpo...</h1>

<script type="text/javascript"> Cufon.now(); </script>
</body>
</html>

​

But all I get is plain black text...

Was it helpful?

Solution

This is a problem with your Source_Sans_Pro_400.font.js file. If I add Vegur.font.js, the gradient works just fine.

Demo

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top