DocodeLab - Web Design/Development Tutorial: February 2009

Wednesday, February 25, 2009

how to use br to reduce the space in css

Posted by lc marshal at 2:14 AM

on your code editor ( dreamweaver or notepad);

1. type

.shortentbrclasshere br {
height40%;
}

2.save it as a .css file

3. Remember to link your css to your html file.

4.Apply the 'br' tag on your reference need to your html.

etc;

dummy dummy dummy
dummy dummy dummy

good luck ;)

Friday, February 20, 2009

How to build TOC navigation

Posted by admin at 1:19 AM

1) Paste the whole code, and fill it into <head> to </head> in your html
code 1
<br /><style type="text/css"><br /><br /></style><br /><br /><script type="text/javascript"><br /><br /><br /><br /><a id="tocPos"></a><br /><br /><br /><a href="#tocPos" title="AccessKey: t" accesskey="t"></a><br /><br /><br /><input type = "button" value = "Table of Contents" onclick = "toggleTOC()"><br /><br /><br /><div id="TOC"><br /></div><br /><br /><h1>header 1</h1><br /><p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore</p><br /><br /><h2>header 1.1</h2><br /><h3>header 1.1.1</h3><br /><p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore</p><br /><p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore</p><br /><br /><h1>header 2</h1><br /><h2>header 2.1</h2><br /><h3>header 2.1.1</h3><br /><h4>header 2.1.1.1</h4><br /><p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore</p><br /><br /><h4>header 2.1.1.2</h4><br /><p>paragraph 4</p><br /><br /><h3>header 2.1.2</h3><br /><h4>header 2.1.2.1</h4><br /><p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore</p><br /><br /><h1>header 3</h1><br /><p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore</p><br />

Create Navigation menu effect : follow the mouse

Posted by admin at 12:52 AM

A sleek animation effect using tabs for a slide navigation bar. Degrades very nicely when JavaScript is turned-off.

1) Paste the following code below into the CSS section of your HTML

</div><div><br /></div><div></div><div><br /></div><div>#miniflex {</div><div>  width: 100%;</div><div>  float: left;</div><div>  font-size: small; /* could be specified at a higher level */</div><div>  margin: 0;</div><div>  padding: 0 10px 0 10px;</div><div>  border-bottom: 1px solid #696;</div><div>  position:relative;</div><div>  z-index:2;</div><div>}</div><div><br /></div><div>#miniflex li {</div><div>  float: left;</div><div>  margin: 0;</div><div>  padding: 0;</div><div>  display: inline;</div><div>  list-style: none;</div><div>  position:relative;</div><div>}</div><div><br /></div><div>#miniflex a:link, #miniflex a:visited {</div><div>  float: left;</div><div>  font-size: 85%;</div><div>  line-height: 20px;</div><div>  font-weight: bold;</div><div>  margin: 0 10px 0 10px;</div><div>  text-decoration: none;</div><div>  color: #9c9;</div><div>}</div><div><br /></div><div>#miniflex a.active:link, #miniflex a.active:visited, #miniflex a:hover {</div><div>  border-bottom: 4px solid #696;</div><div>  padding-bottom: 2px;</div><div>  color: #696;</div><div>}</div><div>  </div><div>#animated-tab {</div><div>  position: absolute;</div><div>  z-index: 1;</div><div>  font-size: 85%;</div><div>  line-height: 20px;</div><div>  padding-bottom: 2px;</div><div>  border-bottom: 4px solid #696;</div><div>}</div><div><br /></div><div><br /></div><div><br /></div><div></div><div><br /></div><div>/* This script and many more are available free online at</div><div>The JavaScript Source :: http://javascript.internet.com</div><div>Created by: Brian McAllister :: http://www.frequency-decoder.com/ */</div><div><br /></div><div>/*</div><div>Animated miniTabs by frequency decoder</div><div>Further information on this script can be located</div><div>on the authors Web site http://www.frequency-decoder.com/</div><div><br /></div><div>Based on an idea by Rob L Glazebrook</div><div>(http://www.rootarcana.com/test/smartmini/)</div><div>which was derived from the original idea of Stephen Clark</div><div>(http://www.sgclark.com/sandbox/minislide/)</div><div><br /></div><div>Changes</div><div>=======</div><div>05/03/06 : Creation</div><div>08/03/06 : Added the cleanUp method to stop IE memory leaks.</div><div><br /></div><div>This script is distributed under a "Attribution-NonCommercial-ShareAlike 2.0" license</div><div><br /></div><div>You are free:</div><div>  1. to copy, distribute, display, and perform the work.</div><div>  2. to make derivative works.</div><div><br /></div><div>Under the following conditions:</div><div><br /></div><div>  1. **Attribution*: You must attribute the work in the manner specified</div><div>     by the author or licensor.</div><div>  2. Noncommercial*: You may not use this work for commercial purposes.*</div><div>  3. Share Alike*: If you alter, transform, or build upon this work,</div><div>     you may distribute the resulting work only under a license identical to this one.</div><div>*/</div><div><br /></div><div><br /></div><div>var miniTab = {</div><div>  currentTab:     0,</div><div>  activeTab:      0,</div><div>  destX:          0,</div><div>  destW:          0,</div><div>  t:              0,</div><div>  b:              0,</div><div>  c:              0,</div><div>  d:              20,</div><div>  animInterval:   null,</div><div>  sliderObj:      null,</div><div>  aHeight:        0,</div><div>  </div><div>  init: function() {</div><div>    if(!document.getElementById || !document.getElementById("miniflex")) return;</div><div>    </div><div>    var ul          = document.getElementById("miniflex");</div><div>    var liArr       = ul.getElementsByTagName("li");</div><div>    var aArr        = ul.getElementsByTagName("a");</div><div>    </div><div>    for(var i = 0, li; li = liArr[i]; i++) {</div><div>      liArr[i].onmouseover = aArr[i].onfocus = function(e) {</div><div>        var pos = 0;</div><div>        var elem = this.nodeName == "LI" ? this : this.parentNode;</div><div>        while(elem.previousSibling) {</div><div>          elem = elem.previousSibling;</div><div>          if(elem.tagName && elem.tagName == "LI") pos++;</div><div>        }</div><div>        miniTab.initSlide(pos);</div><div>      }</div><div>    }</div><div><br /></div><div>    ul.onmouseout = function(e) {</div><div>      miniTab.initSlide(miniTab.currentTab);</div><div>    };</div><div>    </div><div>    for(var i = 0; i <><div>      if(document.location.href.indexOf(aArr[i].href)>=0) {</div><div>        miniTab.activeTab = miniTab.currentTab = i;</div><div>      }</div><div>      aArr[i].style.borderBottom  = "0px";</div><div>      aArr[i].style.paddingBottom = "6px";</div><div>    }</div><div><br /></div><div>    miniTab.slideObj                = ul.parentNode.appendChild(document.createElement("div"));</div><div>    miniTab.slideObj.appendChild(document.createTextNode(String.fromCharCode(160)));</div><div>    miniTab.slideObj.id             = "animated-tab";</div><div>    miniTab.slideObj.style.top      = (ul.offsetTop + liArr[miniTab.activeTab].offsetTop + aArr[miniTab.activeTab].offsetTop) + "px";</div><div>    miniTab.slideObj.style.left     = (ul.offsetLeft + + liArr[miniTab.activeTab].offsetLeft + aArr[miniTab.activeTab].offsetLeft) + "px";</div><div>    miniTab.slideObj.style.width    = aArr[miniTab.activeTab].offsetWidth + "px";</div><div>    miniTab.aHeight                 = ul.offsetTop + liArr[miniTab.activeTab].offsetTop + aArr[miniTab.activeTab].offsetTop;</div><div>    </div><div>    miniTab.initSlide(miniTab.activeTab, true);</div><div>    </div><div>    var intervalMethod = function() { miniTab.slideIt(); }</div><div>    miniTab.animInterval = setInterval(intervalMethod,10);</div><div>  },</div><div><br /></div><div>  cleanUp: function() {</div><div>    clearInterval(miniTab.animInterval);</div><div>    miniTab.animInterval = null;</div><div>  },</div><div>  </div><div>  initSlide: function(pos, force) {</div><div>    if(!force && pos == miniTab.activeTab) return;</div><div>    miniTab.activeTab = pos;</div><div>    miniTab.initAnim();</div><div>  },</div><div>  </div><div>  initAnim: function() {</div><div>    var ul          = document.getElementById("miniflex");</div><div>    var liArr       = ul.getElementsByTagName("li");</div><div>    var aArr        = ul.getElementsByTagName("a");</div><div>    miniTab.destX = parseInt(liArr[miniTab.activeTab].offsetLeft + liArr[miniTab.activeTab].getElementsByTagName("a")[0].offsetLeft + ul.offsetLeft);</div><div>    miniTab.destW = parseInt(liArr[miniTab.activeTab].getElementsByTagName("a")[0].offsetWidth);</div><div>    miniTab.t = 0;</div><div>    miniTab.b = miniTab.slideObj.offsetLeft;</div><div>    miniTab.c = miniTab.destX - miniTab.b;</div><div>    miniTab.bW = miniTab.slideObj.offsetWidth;</div><div>    miniTab.cW = miniTab.destW - miniTab.bW;</div><div>    miniTab.slideObj.style.top = (ul.offsetTop + liArr[miniTab.activeTab].offsetTop + aArr[miniTab.activeTab].offsetTop) + "px";</div><div>  },</div><div>  </div><div>  slideIt:function() {</div><div>    var ul          = document.getElementById("miniflex");</div><div>    var liArr       = ul.getElementsByTagName("li");</div><div>    var aArr        = ul.getElementsByTagName("a");</div><div>    </div><div>    // Has the browser text size changed?</div><div>    if(miniTab.aHeight != ul.offsetTop + liArr[miniTab.activeTab].offsetTop + aArr[miniTab.activeTab].offsetTop) {</div><div>      miniTab.initAnim();</div><div>      miniTab.aHeight = ul.offsetTop + liArr[miniTab.activeTab].offsetTop + aArr[miniTab.activeTab].offsetTop</div><div>    };</div><div>    </div><div>    if(miniTab.t++ <><div>      var x = miniTab.animate(miniTab.t,miniTab.b,miniTab.c,miniTab.d);</div><div>      var w = miniTab.animate(miniTab.t,miniTab.bW,miniTab.cW,miniTab.d);</div><div>      miniTab.slideObj.style.left = parseInt(x) + "px";</div><div>      miniTab.slideObj.style.width = parseInt(w) + "px";</div><div>    } else {</div><div>      miniTab.slideObj.style.left = miniTab.destX + "px";</div><div>      miniTab.slideObj.style.width = miniTab.destW +"px";</div><div>    }</div><div>  },</div><div><br /></div><div>  animate: function(t,b,c,d) {</div><div>    if ((t/=d/2) <><div>    return -c/2 * ((--t)*(t-2) - 1) + b;</div><div>  }</div><div>}</div><div><br /></div><div>window.onload = miniTab.init;</div><div>window.onunload = miniTab.cleanUp;</div><div><br /></div><div><br /></div><div><br /></div><div><br /></div><div></div><div><br /></div><div><script type="text/javascript" src="miniTab.js"></script></div><div><br /></div><div><br /></div><div><br /></div><div></div><div><br /></div><div><h2>Animated Mini Tabs</h2></div><div><ul id="miniflex"></div><div>  <li><a href="/about/" title="">About</a></li></div><div>  <li><a href="/archives/" title="">Archives</a></li></div><div>  <li><a href="/the-language-in-the-lab/" title="">The Language in the Lab</a></li></div><div>  <li><a class="active" href="/demo/animated-minitabs/" title="">MiniTab demo</a></li></div><div>  <li><a href="/contact/" title="">Contact</a></li></div><div></ul></div><div>

Thursday, February 19, 2009

How to change search button to your reference image?

Posted by admin at 11:20 PM

1- Simply replace the button with the code below:
<input type="image" value="Go" src="images/go.gif" align="top">

2-You done

Tuesday, February 17, 2009

Watermark background image with javascript

Posted by admin at 6:39 PM

1) Copy the whole script 1( on below) and paste it into <body> the html

2) Change the image directory according to your own reference. Like you see here, im using 'http://farm1.static.flickr.com/70/168958721_f4aab2b479_o.jpg' simply chage this path

Script 1 (paste the whole code between into the <body>
<script language="JavaScript1.2"><br />if (document.all||document.getElementById)<br />document.body.style.background="url('http://farm1.static.flickr.com/70/168958721_f4aab2b479_o.jpg') white center no-repeat fixed"<br /></script>

Posted by admin at 2:05 AM

fdfdfdf

Monday, February 16, 2009

How to create a simple dynamic calendar

Posted by admin at 10:36 PM

1) Copy the whole script 1( on below) and paste it between <meta> to </body> on your main html (via your text editor).

2) Copy the whole script 2( under script 1) to your text or html editor and save as 'simplecalendar.js'.

3) Save the 'simplecalendar.js' to the same path as your main html. ( or you can save it on your own path/directory)

4) You are done!

Script 1 (paste the whole code between <meta> to </body> in your main html)
<style type="text/css"><br /><br />.main {<br />width:200px;<br />border:1px solid black;<br />}<br /><br />.month {<br />background-color:#333333;<br />font:bold 11px verdana;<br />color:white;<br />}<br /><br />.daysofweek {<br />background-color:gray;<br />font:bold 12px verdana;<br />color:white;<br />}<br /><br />.days {<br />font-size: 12px;<br />font-family:arial;<br />color:black;<br />background-color: #ffffff;<br />padding: 2px;<br />}<br /><br />.days #today{<br />font-weight: bold;<br />color: red;<br />}<br /><br /></style><br /><br /><br /><script type="text/javascript" src="js/basiccalendar.js"><br /><br /></script> <br /><br /><br /><br /><table width="60%" border="0" cellspacing="0" cellpadding="0"><br /> <caption><br /> Calendar<br /> </caption><br /> <tr><br /> <td><form><br /><select onchange="updatecalendar(this.options)"><br /><script type="text/javascript"><br /><br />var themonths=['January','February','March','April','May','June',<br />'July','August','September','October','November','December']<br /><br />var todaydate=new Date()<br />var curmonth=todaydate.getMonth()+1 //get current month (1-12)<br />var curyear=todaydate.getFullYear() //get current year<br /><br />function updatecalendar(theselection){<br />var themonth=parseInt(theselection[theselection.selectedIndex].value)+1<br />var calendarstr=buildCal(themonth, curyear, "main", "month", "daysofweek", "days", 0)<br />if (document.getElementById)<br />document.getElementById("calendarspace").innerHTML=calendarstr<br />}<br /><br />document.write('<option value="'+(curmonth-1)+'" selected="yes">Current Month</option>')<br />for (i=0; i<12; value="'+i+'">'+themonths[i]+' '+curyear+'</option>')<br /><br /><br /></script><br /></select><br /><br /><br /><div id="calendarspace"><br /><script><br />//write out current month's calendar to start<br />document.write(buildCal(curmonth, curyear, "main", "month", "daysofweek", "days", 0))<br /></script><br /></div><br /><br /><br /></form></td><br /> </tr><br /></table><br />

Script 2 (simplecalendar.js)
function buildCal(m, y, cM, cH, cDW, cD, brdr){<br />var mn=['January','February','March','April','May','June','July','August','September','October','November','December'];<br />var dim=[31,0,31,30,31,30,31,31,30,31,30,31];<br /><br />var oD = new Date(y, m-1, 1); //DD replaced line to fix date bug when current day is 31st<br />oD.od=oD.getDay()+1; //DD replaced line to fix date bug when current day is 31st<br /><br />var todaydate=new Date() //DD added<br />var scanfortoday=(y==todaydate.getFullYear() && m==todaydate.getMonth()+1)? todaydate.getDate() : 0 //DD added<br /><br />dim[1]=(((oD.getFullYear()%100!=0)&&(oD.getFullYear()%4==0))||(oD.getFullYear()%400==0))?29:28;<br />var t='<div class="'+cM+'"><table class="'+cM+'" cols="7" cellpadding="0" border="'+brdr+'" cellspacing="0"><tr align="center">';<br />t+='<td colspan="7" align="center" class="'+cH+'">'+mn[m-1]+' - '+y+'</td></tr><tr align="center">';<br />for(s=0;s<7;s++)t+='<td class="'+cDW+'">'+"SMTWTFS".substr(s,1)+'</td>';<br />t+='</tr><tr align="center">';<br />for(i=1;i<=42;i++){ var x=((i-oD.od>=0)&&(i-oD.od<dim[m-1]))? x="=" x="'<span" id="today">'+x+'</span>' //DD added<br />t+='<td class="'+cD+'">'+x+'</td>';<br />if(((i)%7==0)&&(i<36))t+='</tr><tr align="center">';<br />}<br />return t+='</tr></table></div>';<br />}<br /><br />

How to create API drawing in flash

Posted by admin at 2:01 AM

API Drawing

Flash MX comes with a wide range of new features. On of these new features if the "API Drawing" ability. This means you can start off with a completly blank stage and have your script do the drawing at runtime. In this tutorial I will teach you how to make the above drawing application using API. I expect you to be able to use and have a strong knowledge in actionscripting.

Tutorial

1) create a new movie and select the first frame. Open the actionscript window so your ready to enter code. first you will enter the code to create a movie clip.

createEmptyMovieClip("myClip",1);

2) Now you will set the thickness, colour, and alpha value of the line. The colour is a hexadecimal value, and the alpha is a value between 1 and 100.

myClip.lineStyle(1,0x000000,100);

3) This following code will actualy draw the line when you put you click your mouse button.

onMouseDown = function () {
myClip.moveTo(_xmouse, _ymouse);
onMouseMove = function () { myClip.lineTo(_xmouse, _ymouse);};
};
onMouseUp=function(){
onMouseMove=null;
}

The function "onMouseDown" activates when you click your mouse button. it then moves the mouse to the starting point of your line, which will be directly under where you clicked. "onMouseMove" draws a line to your mouse using the lineTo() action. "onMouseMove" is used as aposed to "onEnterFrame" because it is only active when the user is moving there mouse. The last function "turns off" the "onMouseMove" function so that the line will not be drawn agian until the user clicks the mouse button agian.

All this code is to be entered into the first frame of your movie clip in the sequence that is displayed here.

source : www.bezzanet.zzn.com

How to create a Contact Flash Form

Posted by admin at 1:09 AM

Step 1
Open a new document in flash. Set the document dimensions what ever you like. Select first frame in the time line open the

Action Script Panel (F9), and paste this script:
stop();

------------------------------------------------------------------

Step 2
Select the second frame and insert keyframe and in the script paste this:

stop();

------------------------------------------------------------------
Step 3

Select the Text Tool in the left dialog box or just press „T“ key. Set the text tool properties to values lilke this :

------------------------------------------------------------------
Step 4

Make 4 of input text fields like it is shown in picture below:

Note: for the second input field set the „var“ value to „subject“, for the third set „var“ „message“ and for the fourth „email“

------------------------------------------------------------------
Step 5

Write the field names like this: (you can just write it)

------------------------------------------------------------------
Step 6

Now make,in the same layer, in the same frame, 2 buttons like in the picture above. Select the send button and press F9 and add this script :

on (release) {
if (name eq "" or subject eq "" or message eq "" or email eq "") {
stop();
} else {
loadVariablesNum("form.php", 0, "POST");
gotoAndStop(2);
}
}

Now select the clear button and press F9 and add this script inside :

on (release) {
name = "";
subject="";
message="";
email="";
}

------------------------------------------------------------------
Step 7

Now select second frame in the timeline, and in the middle of stage write „Thanks, mail sent“
Save the file and name it form.fla and Go to File->Export and export the movie form.swf

------------------------------------------------------------------
Step 8

Open Macromedia Dreamweaver or any text editor (notepad).
Open a new file, name it form.php and write folowing code:

your_email@email.com";
$msg = "$name\n\n";
$msg .= "$message\n\n";

mail($to, $subject, $msg, "Message From: Online client\nReply-To: $email\n");

------------------------------------------------------------------
Step 9

Save the file as form.php. Make sure that you saved your php file in the same folder as your form.swf file.

We're done!

Saturday, February 14, 2009

Using the keyboard with Google Chrome

Posted by admin at 7:37 PM

Google Chrome was released in beta today (Tuesday, September 2). This is Google’s browser, currently only for Windows, and its arrival rekindles the browser wars into a three-way race between Mozilla’s Firefox, Microsoft’s Internet Explorer, and now Google’s Chrome.

Chrome offers much faster loading speed and more stability as its main differentiators, but also a new feature called an “incognito session” (which we’ll cover later today), plus the ability to quickly use web sites (such as Gmail) as applications on your desktop and Start menu.

The majority of the Firefox keyboard shortcuts we’ve covered here previously do work in Chrome. There are a few exceptions, which I’ve outlined below.

Here’s what works:

For tab navigation, you’ll use Ctrl+T to create a new tab, Ctrl+1 or Ctrl+2 (etc.) to switch tabs (or Ctrl+Page Up/Ctrl+Page Down), Ctrl+W to close a tab, andCtrl+Shift+T to re-open a tab you just closed. Ctrl+L still jumps you up to the location bar (called an “omnibox” in Google Chrome parlance).
Ctrl+R or F5 reloads the page. (And Ctrl+R or Ctrl+F5 forces a reload.)
For navigation, Alt+Home goes to the home page and you can use Alt+Left Arrow and Alt+Right Arrow (or Backspace and Shift+Backspace) to go back or forward a page in your history.
Ctrl+B toggles on/off the bookmark bar.
Ctrl+D still sets a bookmark.
Ctrl+J opens a download tab.
Ctrl+H opens a history tab.
Ctrl+U views source.
You set font size the same way: Ctrl+= (aka Ctrl++) still makes the font bigger, Ctrl+- (dash) makes the font smaller, and Ctrl+0 resets it back to normal.
Ctrl+K or Ctrl+E to search does still work too, but not quite in the same method as Firefox: It simply moves you up to the omnibox with a question mark pretyped, which will then allow you to type in your search term and press Enter to get a search result. (You cannot choose a specific search engine with Alt+Down Arrow as you can with Firefox.)
Alt+Enter after typing a URL in the omnibar still opens a new tab with that content.

All in all, I’m pretty pleased with the keyboard control of Chrome, but there’s a lot of room for improvement in this beta:

There’s no apparent way to open the “Control the current page” and “Customize and control Google Chrome” dropdown menu icons in the upper right, except by clicking.
In a very serious breach of Windows usability, the F1 key does nothing at all instead of calling up help.
The list of keyboard shortcuts in their help is very incomplete.
Ctrl+S does nothing instead of saving the current web page, although you can right-click (even with Shift+F10) and choose “Save as” from the shortcut menu.
At least one keyboard command, Ctrl+O to open a file, has no listing anywhere on any menu. (All keyboard shortcut commands should have toolbar icons or menu entries as equivalents, and those icons or commands should always list the keyboard shortcut as a visual reminder.)
When Chrome offers to save a password when you log in to a site, there’s no keyboard method to say yes or no — you have to click on one of the buttons that appear.
You can’t navigate your saved bookmarks in a menu to select a site as you can with Firefox’s bookmark menu. (In Chrome, you can only click on the bookmark toolbar under “Other bookmarks” or search bookmarks in the omnibox using Ctrl+L and typing in a few letters from the bookmark.)

Here are some of the Firefox keyboard commands that do NOT work in Chrome:

F11 for full screen
/ to search within the page
Shift+Delete to forget a form entry
Ctrl+Shift+B does not let you organize/edit your bookmarks.
In Firefox, F6 toggles between the bar and the document. In Chrome, it only goes to the omnibox and doesn’t let you leave.

Thursday, February 12, 2009

How to create popup window with javascript

Posted by admin at 11:14 PM

Insert and copy the following code to the link area

Instruction:
Change the directory name etc: 'myfile/myfile.htm' follows by your file and directory name.

<a href="myfile/myfile.htm" onclick="MyWindow1=window.open('myfile/myfile.htm','MyWindow1','toolbar=no,location=no,directories=no,status=yes,menubar=no,scrollbars=yes,resizable=no,width=500,height=300,left=10,top=10'); return false;" target="win2" class="bottommenu2">View document list </a>

hope it help.
Good luck

How to create 'back to previous page' script?

Posted by admin at 9:42 PM

How to enable 'back to previosu page on your site? the function shown below practically multi-purpose, simple and the most friendly

Copy and paste this code into your HTML where you would like the button to appear ( the selected area you wanna insert the button):

<form><br /><input type="button" value="Back to Previous Page" onclick="javascript: history.go(-1)"><br /></form>

Its simple, and help your visitor to navigate your site easily .

Good luck

Overview of Macromedia Flash and database integration

Posted by admin at 9:37 AM

Introduction
A Macromedia Flash movie cannot communicate directly with a database. However, Macromedia Flash movies can "talk" to server-side applications (also referred to as "middleware"). Middleware can query a database and relay data back and forth. There are many server applications available. Some of the most common are CGI, ASP, PHP, ColdFusion and Tango.

Integrating a Flash movie with a database on a server is the key to creating rich, platform-independent web applications. For this process to work, a developer must know many aspects of web application building - including Flash design, ActionScript, writing server scripts, and administering a database. The workload for creating this kind of delivery tends to fall on one person, and requires manual updating when necessary.

Macromedia Flash is a vehicle
For the purpose of this topic, it's best to think of a Macromedia Flash movie as a vehicle for gathering and displaying data. The Flash movie is similar to an HTML-based form in the way that it captures and forwards information. Learning how to use a database with Flash requires a knowledge of how to create a form in Flash. Please follow the links at the end of this TechNote for more information.

Additionally, using a database for the web requires specific knowledge of databases, server applications, server scripting languages and areas that are beyond the scope of this TechNote. Consult your Internet Service Provider (ISP) or server administrator with any questions you may have about your configuration.

Typically, databases that are used for web purposes include Oracle, Microsoft MSSQL and Access, FileMaker, MySQL, FoxPro and Sybase. These databases all use various protocols that work with server middleware. Some are meant for enterprise-level sites, while others are best suited for low-traffic sites.Some common uses for Flash and database interaction include:

-Dynamic content
-Guestbooks
-Password protection
-E-commerce
-Web application building
-Saving the state of a movie
-Personalization

Examples of Macromedia Flash and database communicationFlash form data can be inserted into a database:

On the simplest level, a Macromedia Flash form can take in user data via editable text fields. The Load Variables or GetURL actions can send the data (GET or POST) to the middleware, which will compose the data into the correct format that the database requires.

Thursday, February 5, 2009

All you need to know about buying a house

Posted by admin at 7:19 PM

Recently, I'm working on updating the layout table (for user usability) and information for :
Process Flow of Property Acquisition & Home Loan Application (Malaysia)

Do you know what may involved when you purchase a property?
This is the complete guides of thing that you must know.
Simply point your URL here >

May fortune favor us

Posted by admin at 7:13 PM

we had a company CNY lunch at one chinese restaurant near our Office, in Damansara. May fortune favor to those work on it. Happy new year guys..

Tuesday, February 3, 2009

How to play FLV file in your Powerpoint

Posted by admin at 7:59 PM

How to play FLV file in your Powerpoint, Please read on the following steps.

1) Get the latest VLC media player on http://www.videolan.org/vlc/

Download and install it to your pc

2) Download FLV via a popular video host site, like youtube, save it to your pc, and dont forget change the extension file to .flv .etc ; 'yourfile.flv'

3) Go to your Powerpoint, and start searching for hidden control toolbox.

Click Office button > PowerPoint Options > Popular > and pls tick "Show Developer tab in the Ribbon".

4) Click "Developer” (where? horizontally aligned with 'home' button), next, you need to click the icon "More Controls" which is displayed as hummer and wrench in the 'Controls' section.

5) Upon the prompt-up dialog box,pls select "VideoLAN VLC ActiveX Plugin v1/v2"

6) Once it done, back to your Powerpoint, and click the position for where you want the shape is displayed, use your mouse to resize as you prefer.

7) Go to Properties tab ( by right click the area you drew) , and complete the value of attribute "MRL" with the directory path of the FLV file, , etc: D:\video\yourfile.flv, close the tab when finished.

8) You are done! the FLV file is ready to play in your Powerpoint on your pc.

Good luck!

How to called PDF from flash?

Posted by admin at 7:32 PM

How to called the (multi) PDF file from your flash?

Its so simple.

If you are Flash designer or programmer, you supposely familiar with getURL command.

etc :

on(release){

getURL("yourdirectory/yourpdf.pdf",'blank');

;

For beginner:

1) Create a button with Flash

2) Once it done, highlight the button, and press F9 (keyboard)

3) Upon the actionscript box prompt-up, add the following command (as mentioned on above)

4) Publish it (control+enter or shift+F12 to published via internet browser)

5) You are done!

Good luck

(Take noted, that the following url command is 2.0 version)

Gong xi fa cai

Posted by admin at 7:30 PM

Happy Chinese New year to all Chinese comrades, and people around the world :)

Docode - Free Flash Source Code Blog

Docode - Free Flash Source Code Blog

Wednesday, February 25, 2009

how to use br to reduce the space in css

Friday, February 20, 2009

How to build TOC navigation

Create Navigation menu effect : follow the mouse

Thursday, February 19, 2009

How to change search button to your reference image?

Tuesday, February 17, 2009

Watermark background image with javascript

Monday, February 16, 2009

How to create a simple dynamic calendar

How to create API drawing in flash

How to create a Contact Flash Form

Saturday, February 14, 2009

Using the keyboard with Google Chrome

Thursday, February 12, 2009

How to create popup window with javascript

How to create 'back to previous page' script?

Overview of Macromedia Flash and database integration

Thursday, February 5, 2009

All you need to know about buying a house

May fortune favor us

Tuesday, February 3, 2009

How to play FLV file in your Powerpoint

How to called PDF from flash?

Gong xi fa cai

Search Articles

Study Categories

Articles History

Global Menu

Docode - Free Flash Source Code Blog a2a_linkname=document.title;a2a_linkurl="http://docodelab.blogspot.com"; a2a_linkname=document.title;a2a_linkurl=location.href;

Docode - Free Flash Source Code Blog

Wednesday, February 25, 2009

Friday, February 20, 2009

Thursday, February 19, 2009

Tuesday, February 17, 2009

Monday, February 16, 2009

Saturday, February 14, 2009

Thursday, February 12, 2009

Thursday, February 5, 2009

Tuesday, February 3, 2009

Search Articles

Study Categories

Articles History

Global Menu

Docode - Free Flash Source Code Blog