JavaScript - Curious Behaviour On Css Style Changer

//** Featured Content Slider script- (c) Dynamic Drive DHTML code library: http://www.dynamicdrive.com.
//** May 2nd, 08'- Script rewritten and updated to 2.0.
//** June 12th, 08'- Script updated to v 2.3, which adds the following features:
			//1) Changed behavior of script to actually collapse the previous content when the active one is shown, instead of just tucking it underneath the later.
			//2) Added setting to reveal a content either via "click" or "mouseover" of pagination links (default is former).
			//3) Added public function for jumping to a particular slide within a Featured Content instance using an arbitrary link, for example.

//** July 11th, 08'- Script updated to v 2.4:
			//1) Added ability to select a particular slide when the page first loads using a URL parameter (ie: mypage.htm?myslider=4 to select 4th slide in "myslider")
			//2) Fixed bug where the first slide disappears when the mouse clicks or mouses over it when page first loads.

var featuredcontentslider={

//3 variables below you can customize if desired:
ajaxloadingmsg: '<div style="margin: 20px 0 0 20px"><img src="../images/loading.gif" /> Fetching slider Contents. Please wait...</div>',
bustajaxcache: true, //bust caching of external ajax page after 1st request?
enablepersist: true, //persist to last content viewed when returning to page?

settingcaches: {}, //object to cache "setting" object of each script instance

jumpTo:function(fcsid, pagenumber){ //public function to go to a slide manually.
	this.turnpage(this.settingcaches[fcsid], pagenumber)
},

ajaxconnect:function(setting){
	var page_request = false
	if (window.ActiveXObject){ //Test for support for ActiveXObject in IE first (as XMLHttpRequest in IE7 is broken)
		try {
		page_request = new ActiveXObject("Msxml2.XMLHTTP")
		} 
		catch (e){
			try{
			page_request = new ActiveXObject("Microsoft.XMLHTTP")
			}
			catch (e){}
		}
	}
	else if (window.XMLHttpRequest) // if Mozilla, Safari etc
		page_request = new XMLHttpRequest()
	else
		return false
	var pageurl=setting.contentsource[1]
	page_request.onreadystatechange=function(){
		featuredcontentslider.ajaxpopulate(page_request, setting)
	}
	document.getElementById(setting.id).innerHTML=this.ajaxloadingmsg
	var bustcache=(!this.bustajaxcache)? "" : (pageurl.indexOf("?")!=-1)? "&"+new Date().getTime() : "?"+new Date().getTime()
	page_request.open('GET', pageurl+bustcache, true)
	page_request.send(null)
},

ajaxpopulate:function(page_request, setting){
	if (page_request.readyState == 4 && (page_request.status==200 || window.location.href.indexOf("http")==-1)){
		document.getElementById(setting.id).innerHTML=page_request.responseText
		this.buildpaginate(setting)
	}
},

buildcontentdivs:function(setting){
	var alldivs=document.getElementById(setting.id).getElementsByTagName("div")
	for (var i=0; i<alldivs.length; i++){
		if (this.css(alldivs[i], "contentdiv", "check")){ //check for DIVs with class "contentdiv"
			setting.contentdivs.push(alldivs[i])
				alldivs[i].style.display="none" //collapse all content DIVs to begin with
		}
	}
},

buildpaginate:function(setting){
	this.buildcontentdivs(setting)
	var sliderdiv=document.getElementById(setting.id)
	var pdiv=document.getElementById("paginate-"+setting.id)
	var phtml=""
	var toc=setting.toc
	var nextprev=setting.nextprev
	if (typeof toc=="string" && toc!="markup" || typeof toc=="object"){
		for (var i=1; i<=setting.contentdivs.length; i++){
			phtml+='<a href="#'+i+'" class="toc">'+(typeof toc=="string"? toc.replace(/#increment/, i) : toc[i-1])+'</a> '
		}
		phtml=(nextprev[0]!=''? '<a href="#prev" class="prev">'+nextprev[0]+'</a> ' : '') + phtml + (nextprev[1]!=''? '<a href="#next" class="next">'+nextprev[1]+'</a>' : '')
		pdiv.innerHTML=phtml
	}
	var pdivlinks=pdiv.getElementsByTagName("a")
	var toclinkscount=0 //var to keep track of actual # of toc links
	for (var i=0; i<pdivlinks.length; i++){
		if (this.css(pdivlinks[i], "toc", "check")){
			if (toclinkscount>setting.contentdivs.length-1){ //if this toc link is out of range (user defined more toc links then there are contents)
				pdivlinks[i].style.display="none" //hide this toc link
				continue
			}
			pdivlinks[i].setAttribute("rel", ++toclinkscount) //store page number inside toc link
			pdivlinks[i][setting.revealtype]=function(){
				featuredcontentslider.turnpage(setting, this.getAttribute("rel"))
				return false
			}
			setting.toclinks.push(pdivlinks[i])
		}
		else if (this.css(pdivlinks[i], "prev", "check") || this.css(pdivlinks[i], "next", "check")){ //check for links with class "prev" or "next"
			pdivlinks[i].onclick=function(){
				featuredcontentslider.turnpage(setting, this.className)
				return false
			}
		}
	}
	this.turnpage(setting, setting.currentpage, true)
	if (setting.autorotate[0]){ //if auto rotate enabled
		pdiv[setting.revealtype]=function(){
			featuredcontentslider.cleartimer(setting, window["fcsautorun"+setting.id])
		}
		sliderdiv["onclick"]=function(){ //stop content slider when slides themselves are clicked on
			featuredcontentslider.cleartimer(setting, window["fcsautorun"+setting.id])
		}
		setting.autorotate[1]=setting.autorotate[1]+(1/setting.enablefade[1]*50) //add time to run fade animation (roughly) to delay between rotation
	 this.autorotate(setting)
	}
},

urlparamselect:function(fcsid){
	var result=window.location.search.match(new RegExp(fcsid+"=(\\d+)", "i")) //check for "?featuredcontentsliderid=2" in URL
	return (result==null)? null : parseInt(RegExp.$1) //returns null or index, where index (int) is the selected tab's index
},

turnpage:function(setting, thepage, autocall){
	var currentpage=setting.currentpage //current page # before change
	var totalpages=setting.contentdivs.length
	var turntopage=(/prev/i.test(thepage))? currentpage-1 : (/next/i.test(thepage))? currentpage+1 : parseInt(thepage)
	turntopage=(turntopage<1)? totalpages : (turntopage>totalpages)? 1 : turntopage //test for out of bound and adjust
	if (turntopage==setting.currentpage && typeof autocall=="undefined") //if a pagination link is clicked on repeatedly
		return
	setting.currentpage=turntopage
	setting.contentdivs[turntopage-1].style.zIndex=++setting.topzindex
	this.cleartimer(setting, window["fcsfade"+setting.id])
	setting.cacheprevpage=setting.prevpage
	if (setting.enablefade[0]==true){
		setting.curopacity=0
		this.fadeup(setting)
	}
	if (setting.enablefade[0]==false){ //if fade is disabled, fire onChange event immediately (verus after fade is complete)
		setting.contentdivs[setting.prevpage-1].style.display="none" //collapse last content div shown (it was set to "block")
		setting.onChange(setting.prevpage, setting.currentpage)
	}
	setting.contentdivs[turntopage-1].style.visibility="visible"
	setting.contentdivs[turntopage-1].style.display="block"
	if (setting.prevpage<=setting.toclinks.length) //make sure pagination link exists (may not if manually defined via "markup", and user omitted)
		this.css(setting.toclinks[setting.prevpage-1], "selected", "remove")
	if (turntopage<=setting.toclinks.length) //make sure pagination link exists (may not if manually defined via "markup", and user omitted)
		this.css(setting.toclinks[turntopage-1], "selected", "add")
	setting.prevpage=turntopage
	if (this.enablepersist)
		this.setCookie("fcspersist"+setting.id, turntopage)
},

setopacity:function(setting, value){ //Sets the opacity of targetobject based on the passed in value setting (0 to 1 and in between)
	var targetobject=setting.contentdivs[setting.currentpage-1]
	if (targetobject.filters && targetobject.filters[0]){ //IE syntax
		if (typeof targetobject.filters[0].opacity=="number") //IE6
			targetobject.filters[0].opacity=value*100
		else //IE 5.5
			targetobject.style.filter="alpha(opacity="+value*100+")"
	}
	else if (typeof targetobject.style.MozOpacity!="undefined") //Old Mozilla syntax
		targetobject.style.MozOpacity=value
	else if (typeof targetobject.style.opacity!="undefined") //Standard opacity syntax
		targetobject.style.opacity=value
	setting.curopacity=value
},

fadeup:function(setting){
	if (setting.curopacity<1){
		this.setopacity(setting, setting.curopacity+setting.enablefade[1])
		window["fcsfade"+setting.id]=setTimeout(function(){featuredcontentslider.fadeup(setting)}, 50)
	}
	else{ //when fade is complete
		if (setting.cacheprevpage!=setting.currentpage) //if previous content isn't the same as the current shown div (happens the first time the page loads/ script is run)
			setting.contentdivs[setting.cacheprevpage-1].style.display="none" //collapse last content div shown (it was set to "block")
		setting.onChange(setting.cacheprevpage, setting.currentpage)
	}
},

cleartimer:function(setting, timervar){
	if (typeof timervar!="undefined"){
		clearTimeout(timervar)
		clearInterval(timervar)
		if (setting.cacheprevpage!=setting.currentpage){ //if previous content isn't the same as the current shown div
			setting.contentdivs[setting.cacheprevpage-1].style.display="none"
		}
	}
},

css:function(el, targetclass, action){
	var needle=new RegExp("(^|\\s+)"+targetclass+"($|\\s+)", "ig")
	if (action=="check")
		return needle.test(el.className)
	else if (action=="remove")
		el.className=el.className.replace(needle, "")
	else if (action=="add")
		el.className+=" "+targetclass
},

autorotate:function(setting){
 window["fcsautorun"+setting.id]=setInterval(function(){featuredcontentslider.turnpage(setting, "next")}, setting.autorotate[1])
},

getCookie:function(Name){ 
	var re=new RegExp(Name+"=[^;]+", "i"); //construct RE to search for target name/value pair
	if (document.cookie.match(re)) //if cookie found
		return document.cookie.match(re)[0].split("=")[1] //return its value
	return null
},

setCookie:function(name, value){
	document.cookie = name+"="+value

},


init:function(setting){
	var persistedpage=this.getCookie("fcspersist"+setting.id) || 1
	var urlselectedpage=this.urlparamselect(setting.id) //returns null or index from: mypage.htm?featuredcontentsliderid=index
	this.settingcaches[setting.id]=setting //cache "setting" object
	setting.contentdivs=[]
	setting.toclinks=[]
	setting.topzindex=0
	setting.currentpage=urlselectedpage || ((this.enablepersist)? persistedpage : 1)
	setting.prevpage=setting.currentpage
	setting.revealtype="on"+(setting.revealtype || "click")
	setting.curopacity=0
	setting.onChange=setting.onChange || function(){}
	if (setting.contentsource[0]=="inline")
		this.buildpaginate(setting)
	if (setting.contentsource[0]=="ajax")
		this.ajaxconnect(setting)
}

}

var descurrent = ($('div#description ul li.show')?  $('div#description ul li.show') : $('div#description ul li:first'));
var desclass = '#description li#'+x;

<div id="description">
					<ul>
						<li class="show" id="1">blahblah
						</li>
						<li id="2">
etc
						</li>
					</ul>

//Hide the current image
		descurrent.animate({opacity: 0.0}, 1000)
		.removeClass('show');
	
		//Show new image
		
		$(desclass).addClass('show')
		.animate({opacity: 1.0}, 1000);

e.cancelBubble = true;
if ( e.stopPropagation ) e.stopPropagation();
return false;

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>

	<style text="text/css">

		.dropArea {
			color:#757575;
			font-weight:bold;
			display:block;
			margin:0px;
			border: 1px dashed #999999;
			background-color:#DDDDDD;
			left:10px;
			right:10px;
			/*width:auto;*/
			text-align:center;
			line-height:20px;
		}
		.textEditArea {
			display:block;
			margin-bottom:10px;
			border: 1px dashed #999999;
			background-color:inherit;
			left:10px;
			right:10px;
			padding:5px;
			width:auto;
		}

	</style>

	<script>
		function makeEditable(activeZone) {
			if (activeZone.className == "dropArea") {
				activeZone.innerHTML = "";
			}
			activeZone.contentEditable = true;
			activeZone.className = "textEditArea";
		}

		function doneEditing(activeZone) {
			// if no HTML added, make it a drop zone
			if (trim(activeZone.innerHTML) == "") {
				activeZone.className = "dropArea";
				activeZone.innerHTML = "Drop items from or double click to add text";
			} else if (activeZone.addDropZoneAlready == undefined) {
				// add a new drop zone underneath
				activeZone.title = "Double click to edit text";
				activeZone.addDropZoneAlready = "true";
				activeZone.zoneType = "textDisplay";
				addNewDropZone();
			}
			activeZone.contentEditable = false;
		}

		function addNewDropZone() {
			var dropArea = document.createElement("div");
			dropArea.className = "dropArea";

			var appendTo = document.body;
			appendTo.appendChild(dropArea);

			dropArea.ondblclick = function () { makeEditable(dropArea); };
			dropArea.onblur = function () { alert('done'); doneEditing(dropArea); };

			dropArea.innerHTML = "Drop items or double click to add text";
		}
	</script>

</head>
<body onload="addNewDropZone();">

	<div onDblClick="this.contentEditable=true;" onBlur="this.contentEditable=false;alert('Done!');" style="background-color:#C0C0C0; width: 500px; height:200px;"></div>

</body>
</html>

<html>
<head>

<script language="javascript">
var x;
var y;
var org_top;
var org_left;
var diff_org_top;
var diff_org_left;
var element;
var element2;
var being_dragged = false;
var newleft;
var newtop;

function mouse_move(event)
	{
	if(event.offsetX || event.offsetY) 
		{
		x=event.offsetX;
		y=event.offsetY;
		}
	else	
		{
		x=event.pageX;
		y=event.pageY;
		}

	if(being_dragged = true)
		{
		document.getElementById(element).style.top = y-diff_org_top +'px';
		document.getElementById(element).style.left = x-diff_org_left +'px';
		}
	}

function mouse_down(ele_name)
	{
	being_dragged = true;
	element = document.elementFromPoint(x, y).id;

	org_top = document.getElementById(element).style.top;
	org_left = document.getElementById(element).style.left;

	diff_org_top = y-org_top.substring(org_top.length-2,org_top);
	diff_org_left = x-org_left.substring(org_left.length-2,org_left);
	}

function mouse_up()
	{
	being_dragged = false;
	
	newtop = Math.floor((y-diff_org_top+100)/200) * 200;
	newleft = Math.floor((x-diff_org_left+100)/200) * 200;
	
	if (newtop<0)
		{
		newtop = 0;
		}
	else if (newtop>400)
		{
		newtop = 400;
		}

	if (newleft<0)
		{
		newleft = 0;
		}
	else if (newleft>400)
		{
		newleft = 400;
		}

	document.getElementById(element).style.display = 'none';
	if (document.elementFromPoint(newleft+100, newtop+100).id != '')
		{
		element2 = document.elementFromPoint(newleft+100, newtop+100).id;
		document.getElementById(element2).style.top = org_top;
		document.getElementById(element2).style.left = org_left;
		element2 = null
		}
	document.getElementById(element).style.display = 'block';

	document.getElementById(element).style.top = newtop +'px';
	document.getElementById(element).style.left = newleft +'px';		

	element = null;
	}

</script>

<style type="text/css">
.box
	{
	float:left;
	display:block;
	width:190;
	height:190;
	margin:5;
	position:absolute;
	}

.red
	{
	background:red;
	top:0;
	left:0;
	}

.blue
	{
	background:blue;
	top:0;
	left:201;
	}
	
.yellow
	{
	background:yellow;
	top:0;
	left:401;
	}

.green
	{
	background:green;
	top:201;
	left:0;
	}

.violet
	{
	background:violet;
	top:201;
	left:201;
	}

.orange
	{
	background:orange;
	top:201;
	left:401;
	}

.maroon
	{
	background:maroon;
	top:401;
	left:0;
	}

.lime
	{
	background:lime;
	top:401;
	left:201;
	}

.indigo
	{
	background:indigo;
	top:401;
	left:401;
	}
</style>
</head>

<body onMouseMove="mouse_move(event)">
	<div id="one" class="red box" onMouseDown="mouse_down('one')" onMouseUp="mouse_up()">
	</div>
	
	<div id="two" class="blue box" onMouseDown="mouse_down('two')" onMouseUp="mouse_up()">
	</div>
	
	<div id="three" class="yellow box" onMouseDown="mouse_down('three')" onMouseUp="mouse_up()">
	</div>
	
	<div id="four" class="green box" onMouseDown="mouse_down('four')" onMouseUp="mouse_up()">
	</div>
	
	<div id="five" class="orange box" onMouseDown="mouse_down('five')" onMouseUp="mouse_up()">
	</div>
	
	<div id="six" class="violet box" onMouseDown="mouse_down('six')" onMouseUp="mouse_up()">
	</div>
	
	<div id="seven" class="maroon box" onMouseDown="mouse_down('seven')" onMouseUp="mouse_up()">
	</div>
	
	<div id="eight" class="lime box" onMouseDown="mouse_down('eight')" onMouseUp="mouse_up()">
	</div>
	
	<div id="nine" class="indigo box" onMouseDown="mouse_down('nine')" onMouseUp="mouse_up()">
	</div>
</body>
</html>

<html>

<script type="text/javascript">
function forceSaveAs (filename){
	document.execCommand('SaveAs',null,filename)
}

</script>
<a href='/DVEConfiguration.xml' onclick=\"forceSaveAs('DVEConfiguration.xml_export'); return false\">Download</a>
</html>

print "Content-type: application/octet-stream\n\n";			
print "Content-Disposition: attachment; filename=file.xml;"

this.onInsertSuccess = function (paramsArray) {
        
        var result = Array();
        result[0] = {};
        result[0][this.params.idfield] = paramsArray.id;
        result[0][this.params.titlefield] = "NEW ITEM";
        result[0][this.params.displayfield] = 1;
        
        console.log(this.displayArray.length);
        
        for (x = 0; x < this.displayArray.length; x++) {
            
            
            this.displayArray[x][this.params.displayfield] = x + 2;
            
            result[result.length] = this.displayArray[x];
            
            
            newParams = {idfield:this.params.idfield, id:this.displayArray[x][this.params.idfield], table:this.params.table, displayfield:this.params.displayfield, order:(x+2)};
            this.load.updateItem(newParams);
            
        }
        
        
        this.displayArray = Array();
        
        for (x = 0; x < result.length; x++) {
            
            this.displayArray[x] = result[x];
        }
        
        this.display();
    }

onInsertSuccess = function (id) {
        
        var result = Array();


        result[0] = {};
        result[0][this.params.idfield] = id;
        result[0][this.params.titlefield] = "NEW ITEM";
        result[0][this.params.displayfield] = 1;
        
        for (x = 0; x < this.displayArray.length; x++) {
           
            this.displayArray[x].displayorder = x + 2;
            
            result[result.length] = this.displayArray[x];
            
        }
        
        
        this.displayArray = result;
        
        // this just updates the display and has no effect on displayArray
        this.display();
    }

this.displayArray = [{'clid': "1", 'name': "Yorkshire Digital Awards", 'displayorder': "1"}, {'clid': "2", 'name': "Screen Yorkshire", 'displayorder': "2"}, {'clid': "3", 'name': "SureStart Selby District", 'displayorder': "3"}, {'clid': "4", 'name': "Mencap", 'displayorder': "4"}, {'clid': "5", 'name': "York St. Johns", 'displayorder': "5"}, {'clid': "6", 'name': "Mobstar Media", 'displayorder': "6"}, {'clid': "7", 'name': "Wheatfields Hospice", 'displayorder': "7"}, {'clid': "8", 'name': "The National  Railway Museum", 'displayorder': "8"}];

builder.Append("<a href='EditLevelValues.aspx?levelId=" + levelId + "&amp;levelValueId=" + levelValueId + "&amp;levelName=" + levelName + "&amp;levelValueName=" + levelValueName + "&amp;levelValueDescription="+levelValueDescription+"&amp;placeValuesBeforeTB_=savedValues&amp;TB_iframe=true&amp;height=300&amp;width=500&amp;modal=true&amp;'  class='thickbox obox'>");

trLevels.InnerHtml = builder.ToString();

strLevelValues += "<a href='EditLevelValues.aspx?levelValueName=" + lvlValueName + "&amp;levelId="+lvlId+"&amp;levelValueId=" + lvlValueId + "&amp;levelValueDescription="+lvlValueDescription+"&amp;levelName=Projects&amp;placeValuesBeforeTB_=savedValues&amp;TB_iframe=true&amp;height=300&amp;width=500&amp;modal=true&amp;' class='thickbox obox'>";

trProjLevel[0].innerHTML = strLevelValues;

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Web Design Bournemouth, Graphic Design Hampshire, Logo Design Dorset, Southampton</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="description" content="Website Design and Graphic Design by Action computing, A leading Website Design Company. Website Design, Ecommerce Web Design & Web Development. Logo Design, Label Design ."/>
<meta name="keywords" content="web design bournemouth, website design, web designers, website optimization, advert design,logo design, pc repair, label design, design, web design company, ecommerce, ecommerce web design, hampshire, dorset, bournemouth, southampton"/>
<meta name="author" content="Website and Graphic Design Company, Action Computing"/>
<meta name="language" content="EN"/>
<meta name="Classification" content="Website Design and Graphic Design Company"/>
<meta name="copyright" content="www.ActionComputing.co.uk"/>
<meta name="robots" content="index, follow"/>
<meta name="revisit-after" content="7 days"/>
<meta name="document-classification" content="Website Design and Graphic Development"/>
<meta name="document-type" content="Public"/>
<meta name="document-rating" content="Safe for Kids"/>
<meta name="document-distribution" content="Global"/>

<link href="new-css-rebuild.css" rel="stylesheet" type="text/css" />
<link href="css/lightbox.css" rel="stylesheet" type="text/css" />

<script type="text/javascript" src="jquery.min.js"></script>

<script type="text/javascript" src="fadeslideshow.js">

</script>

<script type="text/javascript">

var mygallery=new fadeSlideShow({
	wrapperid: "fadeshow1",
	dimensions: [220, 200],
	imagearray: [
		["images/demos/sdsasbuilt.jpg", "http://www.asbuiltsdsgroup.co.uk/", "_new", "Asbuilt SDS group front portal"],
		["images/demos/sdsgroup.jpg", "http://www.sds-group.co.uk/", "_new", "SDS Asbuilt group front portal"],
		["images/demos/gillyprint.jpg", "http://www.gillyprinters.com", "_new", "Gilly Print, professional labelling Website"],
		["images/demos/firetradeasia.jpg", "http://www.hemminginfo.co.uk/index.cfm?fuseaction=home.products&producttypeid=2", "_new", "Hemming Information Group online Fire Trade Europe Directory ."],
		["images/demos/timespace.jpg", "http://www.intensive-driving-schools.co.uk/", "_new", "Time and Space driving schools website"],
		["images/partytubhire.jpg", "http://www.partytubhire.co.uk", "_new", "Party Tub Hire Website 'Relax in style'"],
		["images/demos/arborventure.jpg", "http://www.arborventure.co.uk/", "_new", "Arbor Venture Website"]
	],
	displaymode: {type:'auto', pause:2500, cycles:0, wraparound:false},
	persist: false, //remember last viewed slide and recall within same session?
	fadeduration: 500, //transition duration (milliseconds)
	descreveal: "ondemand",
	togglerid: ""
})

</script>
<script type="text/javascript" src="js/prototype.js"></script>
<script type="text/javascript" src="js/scriptaculous.js?load=effects,builder"></script>
<script type="text/javascript" src="js/lightbox.js"></script>
<script src="Scripts/AC_RunActiveContent.js" type="text/javascript"></script>


</head>

<body>
<div class="Container">



<div class="header">
<div class="Topleftmenu">
<p style="text-align:center; padding-top:7px;">
<a class="menu" href="index.html">Home</a> <span class="vertline">|</span> <a class="menu"  href="contact-action-computing-web-design.php">Contact</a> <span class="vertline">|</span> <a class="menu"  href="#">About Us</a> <span class="vertline">|</span></p>

</div>
<div class="topmenuright"></div>
<div class="menumiddle"></div>
<div class="menubottomimage"></div><div class="menubottomright">
  <p style="text-align:center; padding-top:7px;"><a class="menu" href="webdesign-web-designer-hampshire-dorset-bournemouth.htm">Web Design</a> <span class="vertline">|</span><a class="menu" href="pc-maintenance-hampshire-dorset.htm"> PC Maintenance</a> <span class="vertline">|</span>  <a class="menu" href="logo-Design-hampshire-dorset-bournemouth.htm">Logo Design</a> <span class="vertline">|</span> <a class="menu" href="label-Design-hampshire-dorset-bournemouth.htm">Label Design</a> <span class="vertline">|</span> <a class="menu" href="graphic-Design-hampshire-dorset-bournemouth.htm">Other Graphic Design</a></p> 
</div>
<div class="Flashtop">
  <script type="text/javascript">
AC_FL_RunContent( 'codebase','http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,28,0','width','622','height','101','src','images/headermov','quality','high','pluginspage','http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash','movie','images/headermov' ); //end AC code
</script><noscript><object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,28,0" width="622" height="101">
    <param name="movie" value="images/headermov.swf" />
    <param name="quality" value="high" />
    <embed src="images/headermov.swf" quality="high" pluginspage="http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash" type="application/x-shockwave-flash" width="622" height="101"></embed>
  </object></noscript>
</div>
</div>



<div class="content1container">
  <div class="contentleft">
    <div class="insideleftborder"><img src="images/sidegradients.jpg" width="9" /></div>
    <div class="leftcontent-tops">
      <h1 class="titles"> Welcome To Action Computing, Bournemouth!</h1>
    </div>
    <div class="leftcontent-bottom">
      <p><br />
        <h2>Welcome to Action Computing . We are a <strong>Web Design</strong> and <strong>Graphic Design</strong> studio based near  Bournemouth, Dorset on the south coast of the United Kingdom. that specialize in <strong>Web Design</strong>, <strong>Web Optimisation</strong> and all elements of <strong>Graphic Design</strong> including <strong>Stationary Design</strong>, <strong>Logo Design</strong>,<strong> Label Design</strong>, <strong>Advert Design</strong>, <strong>Brochure Design</strong>, <strong>Exhibition Artwork Design</strong> and <strong>Packaging Design</strong>. Action Computing will Design Internationally as well as locally.<br /></h2>
        <br />
      </p>
      <p>Action Computing focuses on three main goals, </p>
      <p>&nbsp;</p>
      <p ><img src="images/QuestionMark.png" width="53" height="51" style="float:right; padding-right:20px; padding-left:20px" /></p>
      <p><strong>One</strong>, making things as simple for the customer as possible using language and explanations that anyone can understand rather than using <strong>Web Design</strong> /<strong> Graphic Design 'jargon'</strong>, this way rather than being confused about the subject matter the client can feel completely Comfortable  with exactly what is going on</p>
      <p>&nbsp;</p>
      <p><img src="images/handshake.jpg"  style="float:right; padding-right:10px; padding-left:20px; padding-top:10px;"/><strong>Two</strong>,  Building a friendly long term relationship with our customers. Successful web site's are not built overnight, they evolve over a period of months   and years and with Action Computing by your side you can guarantee a constant aid to all your <strong>Web Design</strong> and <strong>Graphic Design</strong> needs.</p>
      <p>&nbsp;</p>
      <p><img src="images/pile_english_money.JPG" width="72" height="59" style="float:right; padding-right:10px; padding-left:20px;" /><strong>Three</strong>, Making you money while keeping your Web or <strong>Graphic Design</strong> costs as low as possible. Its all well and good having a pretty web site but if it does not generate money or business then it is simply a waste of time and money, at Action Computing we strive to make sure your web site will succeed.</p>
      <p>&nbsp;</p>
      <p align="justify" class="style10">With over 10 Years of <strong>Web Design</strong> experience we hope to make your journey to the web as smooth as possible and guarantee to cater to your needs as best possible as we can.</p>
      <p align="justify" class="style10">For Everything that is needed to take your first steps into you <strong>Web Design</strong> or <strong>Graphic future</strong> please<a href="contact.php"> click here</a> or above on the appropriate Design needed.</p>
      <br />
      <p align="right" style="border-top:1px dashed #000000; border-bottom:1px dashed #000000; "> Regards<br />
        Action Computing </p>
    </div>
    <div class="leftcontent-tops">
      <h1 class="titles">Our Promise</h1>
    </div>
    <div class="leftcontent-bottom"><br />
      At Action computing are promise to to make you happy, Whether it be <strong>Graphic Design</strong> including <strong>Logo Design</strong>, <strong>Label Design</strong> and <strong>Advert Design</strong> or <strong>Web Design</strong> we will not simply make one <strong>web site</strong> or graphic that you &quot;must&quot; take off us! we will not give up on your <strong>Web site</strong> or Graphics until you are &quot;100%&quot; happy with the outcome, We do usually manage to interpret our customers design dreams to a almost identical result first time, but we will always make your design dreams become a reality!
      <p></p>
      <br />
      <br />
      <p align="right" style="border-top:1px dashed #000000; border-bottom:1px dashed #000000; ">Regards<br />
        Action Computing </p>
      <div align="center">
        <p>All of our web sites are tested on the most common browsers.</p>
        <p>&nbsp;</p>
        <p><img src="images/ie.jpg" style=" padding-left:70px; float:left" /><img src="images/firefox.jpg" style=" padding-left:20px; float:left" /><img src="images/aol.jpg" style=" padding-left:20px; float:left"/><img src="images/SAFARI.jpg" style=" padding-left:20px; float:left"/> </p>
        <p style="clear:both; padding-left:67px; float:left;">Internet Explorer&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Fire Fox&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;AOL&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Safari<br />
          <br /><strong>Web Design Bournemouth, Graphic Design Hampshire, Logo Design Dorset, Southampton </strong></p>
      
        
        
        
      </div>
    </div>
  </div>
  <div class="contentright">
    <div class="insiderightborder"></div>
    <div class="rightcontent-tops">
      <h1 class="titles">Recent Examples</h1>
    </div>
    <div class="rightcontent-bottom">
      <div align="center"><br />
          <a href="images/demos/full size/levelchecker.jpg" title="Level-Checker Web site visit at www.level-checker.co.uk" rel="lightbox"> <img src="images/demos/level-checker.jpg" width="212" height="221" /></a><br />
         <a href="images/demos/full size/levelchecker.jpg" title="Level-Checker Web site visit at www.level-checker.co.uk" rel="lightbox">Level-Checker</a><br />
          Web site        </p>
        <hr />
         <a href="images/demos/full size/asbuilt.jpg" title="Asbuilt SDS Group Web Portal visit at www.asbuiltsdsgroup.co.uk" rel="lightbox"><img src="images/demos/sdsasbuilt.jpg" width="212" height="191" /></a><br />
        <a href="images/demos/full size/asbuilt.jpg" title="Asbuilt SDS Group Web Portal visit at www.asbuiltsdsgroup.co.uk" rel="lightbox">Asbuilt SDS Group</a><br />
        Web site / Portal
        <hr />
        
          <div  id="fadeshow1"></div>
****
  
******
      </div>
    </div>
    <div class="rightcontent-tops"><h1 class="titles">Testimonials</h1></div>
    <div class="rightcontent-bottom"></div>
    
  </div>
  <div class="bottommenu">
    <p><a class="menubottom" href="contact-action-computing-web-design.php">Contact</a> <span class="vertline">| </span><a class="menubottom" href="webdesign-web-designer-hampshire-dorset-bournemouth.htm">Web Design</a> <span class="vertline">|</span><a class="menubottom" href="pc-maintenance-hampshire-dorset.htm"> PC Maintenance</a> <span class="vertline">|</span> <a class="menubottom" href="logo-Design-hampshire-dorset-bournemouth.htm">Logo Design</a> <span class="vertline">|</span> <a class="menubottom" href="label-Design-hampshire-dorset-bournemouth.htm">Label Design</a> <span class="vertline">|</span> <a class="menubottom" href="graphic-Design-hampshire-dorset-bournemouth.htm">Other Graphic Design</a> </p>
    <p>Action Computing email:<a href="mailto:enquiries@actioncomputing.co.uk">enquiries@actioncomputing.co.uk</a> phone: 07927255606</p>
  </div>
</div>
</div>
</body>
</html>

<html>
<head>
	<title>expandable text area</title>
	<style type="text/css">
		#expandable{
			height: 100px;
		}
	</style>
	
</head>
<body>
<form>
	<textarea id="expandable" cols="30" rows="10"></textarea>
</form>
</body>
<script type="text/javascript">
	document.getElementById('expandable').addEventListener('click',function(){
		
		if(!this.style.height){
			this.style.height = this.scrollHeight+'px';
		}
		alert(this.style.height);
	}, true);
</script>
</html>