<commit_before>---
layout: post
title:  "Animated Headlines with background-clip"
date: 2015-01-01 17:39:55
tags: codepen
description: "Have you ever wondered seeing the plugins like Addthis on Wordpress that how they really work. Well, today I'm going to share with you a simple plugin powered by jQuery & css which you of course will love to use on your site"
comments: true
---

New background-clip property is awesome. I set background to the text, use background-clip property and animate it's background image by setting background-position randomly in the keyframes. Here's a look on codepen with some extra new year bang.


<p data-height="268" data-theme-id="0" data-slug-hash="zxKMJP" data-default-tab="result" data-user="abhisack" class='codepen'>See the Pen <a href='http://codepen.io/abhisack/pen/zxKMJP/'>Clipped Text with Animation</a> by <NAME> (<a href='http://codepen.io/abhisack'>@abhisack</a>) on <a href='http://codepen.io'>CodePen</a>.</p>
<script async src="//assets.codepen.io/assets/embed/ei.js"></script>

#####Credit: 
JS coding for snowfall taken from [Codeplayer](http://thecodeplayer.com).<commit_msg>last editted 24 jan 14<commit_after>---
layout: post
title:  "Animated Headlines with background-clip"
date: 2015-01-01 17:39:55
tags: codepen
description: "This year, on its very first day, I was coding something awesome awesome on codepen. Thought should blog about this awesome background-clip property."
comments: true
---

New background-clip property is awesome. I set background to the text, use background-clip property and animate it's background image by setting background-position randomly in the keyframes. Here's a look on codepen with some extra new year bang.


<p data-height="268" data-theme-id="0" data-slug-hash="zxKMJP" data-default-tab="result" data-user="abhisack" class='codepen'>See the Pen <a href='http://codepen.io/abhisack/pen/zxKMJP/'>Clipped Text with Animation</a> by <NAME> (<a href='http://codepen.io/abhisack'>@abhisack</a>) on <a href='http://codepen.io'>CodePen</a>.</p>
<script async src="//assets.codepen.io/assets/embed/ei.js"></script>

#####Credit: 
JS coding for snowfall taken from [Codeplayer](http://thecodeplayer.com).
{'fraction_non_alphanumeric': 0.13342440801457195, 'fraction_numerical': 0.018214936247723135, 'mean_word_length': 4.986376021798365, 'pattern_counts': {'":': 0, '<': 25, '<?xml version=': 0, '>': 25, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '3128562', 'n_tokens_mistral': 716, 'n_tokens_neox': 677, 'n_words': 238}