SO - 29382347

See the plugin repo at GitHub: https://github.com/markserbol/urlive ! Github is not a CDN, download the files for your project.

by Arun P Johny

HTML

<script src="http://markserbol.github.io/urlive/jquery.urlive.js"></script>
<link rel="stylesheet" href="http://markserbol.github.io/urlive/jquery.urlive.css">
<textarea placeholder="input a URL here" class="demo">http://markserbol.github.io/flip-quote1/</textarea>
<div class="urlive-container">
    <span class="loading">Loading...</span>
</div>
<textarea placeholder="input a URL here" class="demo">http://markserbol.github.io/flip-quote/</textarea>
<div class="urlive-container">
    <span class="loading">Loading...</span>
</div>

CSS

* {
    font-family:'Segoe UI', 'Open Sans', sans-serif;
}
textarea {
    width:450px;
    height:70px;
}
.urlive-container {
    margin-top:15px;
    width:450px;
    padding:0 0 50px 0;
}
.loading {
    display:none;
}

JavaScript

$('.demo').on('input propertychange', function () {
    var $this = $(this),
        $ct = $this.next();
    $this.urlive({
        container: $ct,
        callbacks: {
            onStart: function () {
                $ct.html('<span class="loading">Loading...</span>');
            },
            onSuccess: function (data) {},
            noData: function () {
                console.log('y')
                $ct.html('');
            }
        }
    });
}).trigger('input');