Archive for the 'Design' Category

Video Tutorial: Online CSS Formatter and Optimizer

This is a video tutorial I created to showcase an online css formatter and optimizer. I’ll apologize in advance for the poor audio quality towards the end of the video (I’m still learning how to do this), but I don’t think it detracts from the overall message of the video. I’ll see if I can’t spend more time with camstudio to get it set up right. Can’t wait for the next version to come out.

Anyway, if you are creating large CSS files it is a good idea to compress them once a site goes into production mode. In fact, using the compression tool can save you space even if you don’t want to compress it down to one line, so it is always a good idea to do the minimal compression since it will save you some space. The tool I used is located at http://floele.flyspray.org/csstidy/css_optimiser.php, but doing a quick google search yields many results (the code for this must be open source since the same form is on many sites). Enjoy…

video removed…use the new css formatter on DEVTRENCH!

if you liked this post :)

Category: Design | 861 views | Posted: August 7th 2007 01:18 am

Related Posts

How to Make a Resizeable Full Screen Flash Animation

I recently had to create resizeable Flash animation that would play full screen. Here are the steps to creating a full screen flash animation:

  • First of all, the most important aspect of this is to create a flash animation with vectors only. If you create one with bitmap images, when you resize the animation your bitmaps will look bad.
  • Make sure your flash movie doesn’t have a Stage.scaleMode set to “noScale”. This property would be set in your actionscript somewhere and has been a problem for me in the past. Once I used flash code that I didn’t write, and this piece of code was hidden pretty deep in it. It made me want to put my head through the screen when I found it.
  • Set the Stage.scaleMode to “showAll”, “exactFit”, or “noBorders”. You can do this in the action script, or in the embed parameters. Here is an explanation of what each of those properties does. Since I normally link straight to the swf file when doing this, I set the scaleMode in the flash file itself. Example code:

    Stage.scaleMode="showAll";

  • Use javascript to call the full screen window. Use this code:
    <a href="example.swf" onclick="window.open('example.swf', 'flashwindow', 'width='+ (screen.width) +',height='+ (screen.height) +',resizable=yes,left='+ (screen.availWidth/2-0) +',top='+ (screen.availHeight/2-0) +'');return false;">Open Flash Window...</a>


Here is a full screen flash example of what the above code can do:

Open Full Screen Resizable Flash

That’s about all there is to it. If you have specific implementation questions, just contact me.

if you liked this post :)

Category: Design | 1,055 views | Posted: August 5th 2007 02:00 am

Related Posts

Awesome FLV to MOV, and much more converter

I found this free tool today to convert FLV to MOV for a rush project: “Can you download this youtube video and convert it to something i can play in powerpoint???” Some searching on the web led me to SUPER: http://www.erightsoft.com/S6Kg1.html (scroll to the bottom of the page for a link to the setup file). Worked awesome!! To download the youtube vid I used the VideoDownloader plugin for firefox (http://javimoya.com/blog/youtube_en.php)

From the site:

SUPER © Simplified Universal Player Encoder & Renderer.
A GUI to ffmpeg, MEncoder, mplayer, x264, mppenc,
ffmpeg2theora & the theora/vorbis RealProducer plugIn.If you need a simple, yet very efficient tool to convert (encode) or play any Multimedia file,
without reading manuals or spending long hours training, then SUPER © is all you need.
It is a Multimedia Encoder and a Multimedia Player, easy-to-use with 1 simple click.

if you liked this post :)

Category: Design | 894 views | Posted: May 8th 2007 10:58 am

Related Posts

« Prev - Next »