vimeo width on tumblr

Know issue tumblr re开发者_如何学JAVAstricts width of videos to max500, i want them 700. I've tried all the hacks and scripts listed, they won't work on my theme. Any suggestions?

This code was a useful starting point, but it didn't resize the embed tag, too, which means it won't work for all browsers.

<script type="text/javascript">
    $(document).ready(function() {
          var embedTag;
          $('.video').each(function(index) {
               $( this ).contents().each( function ( index ) {
                    if ($(this).is('object') || $(this).is('embed') || $(this).is('iframe')) {
                         var orgWidth = $(this).attr('width');
                         var orgHeight = $(this).attr('height');
                         var scale = orgHeight/orgWidth;
                         var targetWidth = 474;
                         var targetHeight = targetWidth * scale;
                         $(this).attr('width', targetWidth);
                         $(this).attr('height', targetHeight);
                         $(this).find('embed').attr('width', targetWidth);
                         $(this).find('embed').attr('height', targetHeight);
                    }
               });
          });
     });
    </script>

EDIT: A further revision, just in case your videos/media, whatever are embedded within other elements:

<script type="text/javascript">
    $(document).ready(function() {
          var embedTag;
          $('.video, .media').each(function(index) {
               $( this ).find('object, embed, iframe').each( function ( index ) {
                    var orgWidth = $(this).attr('width');
                    var orgHeight = $(this).attr('height');
                    var scale = orgHeight/orgWidth;
                    var targetWidth = 474;
                    var targetHeight = targetWidth * scale;
                    $(this).attr('width', targetWidth);
                    $(this).attr('height', targetHeight);
                    $(this).find('embed').attr('width', targetWidth);
                    $(this).find('embed').attr('height', targetHeight);
               });
          });
     });
    </script>

I had to do the same thing with the theme that I designed/developed for my Tumblr (ridiculouslyawesome.com). In order to get around the 500px max width that Tumblr seems to impose, I came up with a little javascript hack that finds all object/embed/iframe tags in the page and resizes them properly for the theme. This example uses jQuery, but you can alter it to whatever JS framework you prefer to use.

$(document).ready(function() {
      var embedTag;
      $('div.video_container').each(function(index) {
           $( this ).contents().each( function ( index ) {
                if ($(this).is('object') || $(this).is('embed') || $(this).is('iframe')) {
                     var orgWidth = $(this).attr('width');
                     var orgHeight = $(this).attr('height');
                     var scale = orgHeight/orgWidth;
                     var targetWidth = 960;
                     var targetHeight = targetWidth * scale;
                     $(this).attr('width', targetWidth);
                     $(this).attr('height', targetHeight);
                }
           });
      });
 });

So far this has worked pretty good for my theme in all the browsers that I have tested it on. Hopefully it will work for you too. Let me know if you run into any issues with it.

Ryan