Posts Tagged ‘javascript’

How to refresh XML in Flash files

Monday, December 21st, 2009

I have recently been working with loading XML documents in Flash files. This is great technology. The ability to feed dynamic XML data into flash is very powerful and will give you (the designer) a lot of creative freedom. Recently I was using a test XML document in my development environment and altered my XML file. The problem was that every time I re-loaded the file, I was getting the exact same output.

Here is the code that I was using first. Notice that is the same URL.

xmlLoader.load(new URLRequest ("myXMLfile.xml");

Since this file was already cached, it would load over and over again in my output window.

How did I get around this? I added a random query string to the end of URL. I did this by using the Math.random() function built into Flash.

xmlLoader.load(new URLRequest ("myXMLfile.xml?num=" + (Math.random() * 500)));

This little snipped of code will add a random number between 1 and 500 to the end of your query string. You can make the 500 whatever number you want, however I recommend keeping it under 1000.

Hope this helps you!

Tags: , , , , , , , , ,
Posted in Action Script, Flash, XML | No Comments »

Modal Windows for opening images and websites without leaving your website

Tuesday, September 22nd, 2009

I have been working with and designing Modal windows for quite some time now. For the most part I have designed what I want them to look like and then I have used some type of open source to make them work. There are several different types of modal window javascript library’s to download, however I have chosen to use 2, mainly due to thier flexibility and ease of adaptation.

The first type of modal window is what I specifically use to show images. The beauty of a modal window is that you can open an image or a webpage without ever leaving that page or openinig up a pop up window. The modal window can be closed easily by the user and usually it is very light and easy to work with. For the first type of modal window, I would like to promote the Lightbox JS provided by http://huddletogether.com. This is a javascript library, that is open source to the public. It is customizable and works great. I currently use it on my site for some of my images; check out the logo links on the right hand side of this page: http://scottlassiter.com/logos.php. Here you will see that whenever you click on a link it darkens the screen and opens a box the size of your logo or image on the fly. It is very easy to set up and requires intermediate web developing skills to implement.

The second type of modal window I would like to talk about is called “graybox”, you can download it at http://orangoo.com/labs/GreyBox/.  This is a very powerful modal window that provides the ability to open a window to another website. Lets say that you want to promote a certain website, or want to preview a website you have developed or designed. Implement the graybox code on your website and wallah, you can provide a “window” into just about any website. For example, I use this on my website to provide previews of some of the websites that I have developed and designed. Check out “Web Design” on my portfolio page: http://scottlassiter.com/portfolio.php, to see it working in action. Basically, you have to set it so that the window is smaller that the web page you aqre previewing on. In many cases you will have to use the “scroll bars” in the graybox window, however this works great if you just want to show another site as an example and do not necessarily want the user to leave your page, which is key!

Do you have a modal window application that you specifically like or think is easy to work with? Drop a link here or give me a review

Tags: , , , , , , , , , ,
Posted in Open Source, web design | 2 Comments »

How to refresh or reload an iframe that works in Firefox and IE

Monday, June 8th, 2009

Ever have a problem where an iframe that you have in your web page will just not refresh or reload? This is definately a problem if you have updated the source file of the iFrame, yet it does not show recent changes. How do fix this, with a little bit of Javascript!

All you need is just a few lines of code.

First set up your iframe:

<iframe id="yourframe" src="yourframe.html" width="840px" height="3200px" frameborder="0"></iframe>

Next drop this javascript above your body tag:

<script type="text/javascript">
window.reload = refreshFrame;
function refreshFrame() {
document.getElementById('yourframe').src = "yourframe.html";
}
</script>

What reloads the frame, its the window.reload call. By defining the id of the frame and calling it to window.reload will automatically reload the frame every time you refresh or come back to the page. Very easy and it works great. Good luck!

Tags: , , , , ,
Posted in web development | 2 Comments »