Fully Customizable XML Portfolio Website

Full Screen Preview

This portfolio template is fully XML driven. It contains six modules: Vertical Bounced Menu, Horizontal Projects Scroller, Long Text Scroller, News Scroller, FAQs Scroller, Contact Form. Also it can load your own swf file or and an external link.

What’s special?
You can use each module in your other template, because every module is fully customizable, except Vertical Bounced Menu.

Updates:

6. 15, 2009
1. add ‘back to top’ feature for FAQs Scroller.
2. add another module: Vertical Projects Scroller.
3. remove ‘thumb’ element in news.xml, because not useful.
4. fix the alignment of menu and swf when quickly double click browser.

Features:

- xml driven.
- use caurina tweener class for all the tween, smooth.
- can set logo url
- can set bar width, bar height, bar color and bar bg color for loading bar.
- can set blur value and url for background image.
- can set footer text.
- instruction for every variable and every function
- include html file and swfobject.js, can publish easily.
- clean library, just drag mainMc to stage.

How to set up:

step 1:
edit main.xml, change your logo url, loading bar ,footer text, navigation, button roll over and out state, menu items.

step 2:
edit aboutUs.xml, services.xml, contact.xml, faqs.xml, news.xml, portfolio.xml.
step 3:
view index.html, test it in your browser carefully.
step 4:
upload to your server.

Modules:

1. Vertical Bounced Menu
- can set button width, height, round corner radius, right margin, text indent and transitime.
- can set button color, text color, text size and underline for both roll over state and roll out state.
- can set texts and href for each buttons

2. Horizontal Projects Scroller:
- use tooltip to show project name and date.
- use scroll bar to scroll all projects.
- Support SWF , JPG, PNG , GIF.
- can set width, height, corner radius, alpha, color, border width, border color and padding for background.
- can set width, height, corner radius, color and roll over color for scroll button and scroll bar.
- can set up width, height, space and mask corner radius for thumbnails.
- can set up color, alpha, corner radius and text padding for tooltip.
- can set up show time, link(link can be empty), url and target(‘_self’ or ‘_blank’ for each item
- can set up button color, hover color, text color, button corner radius
- Pause/Play large picture rotator

3. Long Text Scroller:
- can set width, height, corner radius, alpha, color, border width, border color and padding for background.
- can set width, height, corner radius, color and roll over color for scroll button and scroll bar.

4. News Scroller:
- use scroll bar to scroll all news.
- Support SWF , JPG, PNG , GIF.
- can set width, height, corner radius, alpha, color, border width, border color and padding for background.
- can set width, height, corner radius, color and roll over color for scroll button and scroll bar.
- can set up show time, link(link can be empty), url and target(‘_self’ or ‘_blank’ for each item
- can set up button color, hover color, text color, button corner radius
- Pause/Play large picture rotator

5. FAQs Scroller:
- use scroll bar to scroll all info.
- can set width, height, corner radius, alpha, color, border width, border color and padding for background.
- can set width, height, corner radius, color and roll over color for scroll button and scroll bar.

6. Contact Form:
- can set width, height, corner radius, alpha, color, border width, border color and padding for background.
- can set height, corner radius, space, show text, font name, font size, font color for text fields. Width of text fields will change automatically according to the background width and padding.
- can set alpha, color, focus in color and transition time for backgrounds of text fields
- can set width, height, corner radius, color, roll over color, transition time, font name, font size and font color for send button.