Skip to content

Instantly share code, notes, and snippets.

@dimiro1
Created December 2, 2013 18:53
Show Gist options
  • Save dimiro1/7754856 to your computer and use it in GitHub Desktop.
Save dimiro1/7754856 to your computer and use it in GitHub Desktop.
Basic Responsive Ads
<!DOCTYPE html>
<html>
<head>
<title>Responsive Ads</title>
</head>
<body>
<div class="728x90">
</div>
<script type="text/javascript" src="http://codeorigin.jquery.com/jquery-1.10.2.min.js"></script>
<script type="text/javascript" src="jquery.responsiveads.js"></script>
<script type="text/javascript">
$(".728x90").responsiveAD({
'operator': '>=',
'width': 728,
'callback': function(element) {
$(element).html('<img src="http://placehold.it/728x90" />');
}});
</script>
</body>
</html>
(function($) {
$.fn.responsiveAD = function(options) {
var options = $.extend({
'operator': '==',
'width': NaN,
'callback': function() {}
}, options);
return this.each(function(i, element) {
switch (options.operator) {
case ">":
if ($(window).width() > options.width) {
options.callback(element);
}
break;
case ">=":
if ($(window).width() >= options.width) {
options.callback(element);
}
break;
case "<":
if ($(window).width() < options.width) {
options.callback(element);
}
break;
case "<=":
if ($(window).width() <= options.width) {
options.callback(element);
}
break;
case "==":
if ($(window).width() == options.width) {
options.callback(element);
}
break;
}
});
};
}(jQuery))
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment