851
131
+35
Via adamwlewis.com. Works great, btw...
I recently added a Flickr Badge to the header of my blog and really loved everything about it except that... there was no way to have it open the photos in a new window when they were clicked. Because the code was written by Flickr I had no way to modify it before it was created, but I did afterwards. Here is the code Flickr gave me to add the badge to my site minus some extra "fluff" code that I've removed for the sake of shortening this post:
<table cellpadding="0" cellspacing="0" border="0" id="flickr_badge_wrapper">
<tr>
<script type="text/javascript" src="http://www.flickr.com/badge_code_v2.gne..."></script>
</tr>
</table>
So, I simply wrote a script that would loop back through all of the links within the table "flickr_badge_wrapper" and change their "target" property to "_blank". Here is the code.
<script>
<!--
var oFlickrTable = document.getElementById("flickr_badge_wrapper");
oFlickrBadgePhotos = oFlickrTable.getElementsByTagName("a");
for (nBadgePhoto = 0; nBadgePhoto < oFlickrBadgePhotos.length; nBadgePhoto++) {
oFlickrBadgePhotos[nBadgePhoto].target = "_blank";
}
//-->
</script>
Feel free to use this code yourself, just be sure that if you've renamed "flickr_badge_wrapper" (or Flickr changed the name by the time you read this article) that you update my code. Enjoy!
Ahh no worries. I've solved my problem.
< base target="_blank" /> into the body did it. Is there a way to adapt this to work for Vimeo badges?
This is their code :S
<style type="text/css">
<!--
/* You can modify these CSS styles */
<!--<FORM> <INPUT type="button" value="New Window!" onClick="window.open('http://www.pageresource.com/jscript/jex5.htm','mywindow','width=400,height=200')"> </FORM>-->
.vimeoBadge { margin: 0; padding: 0; font: normal 11px verdana,sans-serif; }
.vimeoBadge img { border: 0; }
.vimeoBadge a, .vimeoBadge a:link, .vimeoBadge a:visited, .vimeoBadge a:active { color: #3A75C4; text-decoration: none; cursor: pointer; }
.vimeoBadge a:hover { color:#00CCFF; }
.vimeoBadge #vimeo_badge_logo { margin-top:10px; width: 57px; height: 16px; }
.vimeoBadge .credit { font: normal 11px verdana,sans-serif; }
.vimeoBadge .clip { padding:0; float:left; margin:0 10px 10px 0; width:160px; line-height:0; }
.vimeoBadge .caption { font: normal 11px verdana,sans-serif; overflow:hidden; width:160px; height: 30px; }
.vimeoBadge .clear { display: block; clear: both; visibility: hidden; }
-->
</style>
<div class="vimeoBadge">
<script type="text/javascript" src="http://vimeo.com/pufferfish/badgeo/?stream=uploaded&stream_id=&count=9&thumbnail_width=160&show_titles=no"></script>
</div>
