Learn VBA & Macros in 1 Week!

JavaScript - Dom Modification Speed

Full Excel VBA Course - Beginner to Expert

Dom Modification Speed	View Content

Hi all,

I'm justing wondering about the behavior of JS in regards to adding elements, suppose I have something like this

Code:

<div id="myDiv"></div>
...
function test() {
    for (i=0 i<100; i++) {
        var obj = document.create("div");
        // do stuff to style div and set content
        document.getElementById("myDiv").appendChild(obj);
    }
    // DO SOMETHING WITH ONE OF THESE DIVS
}

I'm just wondering at the point I hit that "// DO SOMETHING WITH ONE OF THESE DIVS", are all the divs I have added in the DOM available to access?

I ask because I have some code at work in which a tester is reporting an error that happens which I can't reproduce, and they and others have had it a few times.

The only way I can explain it in my mind is if the div is not available to me at the time of execution. So I'm just looking to rule it out or confirm my hunch.

Is document.getElementById("myDiv").appendChild(obj); synchronous and the next line of code wont execute until the DOM is ready or is it in fact a asynchronous call and therefore adding alot of elements to the DOM could result in a lag so some divs or not available straight away.

Any information much appreciated, I hope I have been clear enough. I'm using IE7 and so are the testers.

Thanks,
Dale

Full Excel VBA Course - Beginner to Expert

Similar Tutorials

Ajax Modification

Modification Of Delaytimer

Javascript Modification Help Required

Image Map, Tooltips Modification

Javascript Widget Modification

Google Map Speed Up

Var Speed In Jquery??

Ticker Speed Ie7 Vs Ie8?!?!

Js Breadcrumb Script - Need Help W/slight Modification..

Modification To Lytebox Info Call

Mouse Speed Onmouseover/out

Modification Of Multiple Dynamic Combo Boxes

Logic Error On Limiting The Modification To The Maxvalue

Detect Connection Speed And Redirect

Detect Connection Speed And Redirect

Jquery Text Effect And Speed

Detect Connection Speed And Redirect

Ball And Paddle Game With User Input Modification

Ie7 - Site Speed Is Dead Slow. What Could Be The Problem?

Does Order Of Logic Comparisons Affect Speed In The Same Statment?

Learn VBA & Macros for Excel in 1 Week!

Ajax Modification

Similar Tutorials

I have been successfully using the following "myAjax" function to load text file information from the server.
Code:

// ajax.js
// From: http://www.webdeveloper.com/forum/showthread.php?t=245681
//  and: http://www.webdeveloper.com/forum/showthread.php?t=245694

// From: http://codingforums.com/showthread.php?t=143412&highlight=file
var myAjax = {
  TextInformation : '',
  myAjaxIO : function (U, V) { //LA MOD String Version. A tiny ajax library.  by, DanDavis
    var X = !window.XMLHttpRequest 
	  ? new ActiveXObject('Microsoft.XMLHTTP') 
	  : new XMLHttpRequest();
    X.open(V ? 'PUT' : 'GET', U, false );
    X.setRequestHeader('Content-Type', 'text/html');
    X.send(V ? V : '');
    return X.responseText;
  },
  doLoad : function (filename) { this.TextInformation = this.myAjaxIO(filename); },
  getTextInfo : function () { // alert(this.TextInformation);  // for testing purposes
    return this.TextInformation }
}
/* example
function Load_and_Show(filename) {
  myAjax.doLoad(filename);
  document.getElementById('TArea').value=myAjax.getTextInfo();
}
*/

After I load the text file, I store the text "records" into an array by doing something like this:
Code:

  var Recs = myAjax.getTextInfo().split('}');

Where the '}' character is my record delimiter. It could just as easily be '\n' or '\r' or the like.
Again, I am not having any problems doing it this way as it suits my current needs.

Now the question(s)
1. Does the call to read the text data from the external file
always read in the entire contents or can I read one line or delimited record
at a time and store it to the array directly without the text storage?

2. If the text is always read completely (my suspicion), can I safely delete
the "TextInformation" after I convert to the array format? Is there any memory
penalty for doing it this way as the text information can be somewhat lengthly
and I don't like the idea of having doubled memory usage when I only need the information in array format anyway?

This is the idea I am considering, but I don't know if there are drawback to this method of if there is a better way to accomplish the task.
Code:

// ajax.js
// From: http://www.webdeveloper.com/forum/showthread.php?t=245681
//  and: http://www.webdeveloper.com/forum/showthread.php?t=245694

// From: http://codingforums.com/showthread.php?t=143412&highlight=file
var myAjax = {
  TextInformation : '',
  TextArrayInfo : [],

  myAjaxIO : function (U, V) { //LA MOD String Version. A tiny ajax library.  by, DanDavis
    var X = !window.XMLHttpRequest 
	  ? new ActiveXObject('Microsoft.XMLHTTP') 
	  : new XMLHttpRequest();
    X.open(V ? 'PUT' : 'GET', U, false );
    X.setRequestHeader('Content-Type', 'text/html');
    X.send(V ? V : '');
    return X.responseText;
  },
  doLoad : function (filename) { this.TextInformation = this.myAjaxIO(filename); },
  getTextInfo : function () { // alert(this.TextInformation);  // for testing purposes
    return this.TextInformation },

  doArrayConvert : function() {
    TextArrayInfo = this.TextInformation.split('}');  // assumes '}' is separator character
    this.TextInformation = '';
  },
  getTextArrayLength : function() {
    return this.TextArrayInfo.length;
  },
  getTextArrayAt : function(ptr) {
    return this.TextArrayInfo[ptr];
  }

}
/* example
function Load_and_Show(filename) {
  myAjax.doLoad(filename);
  document.getElementById('TArea').value=myAjax.getTextInfo();
}
function Convert_to_Array() {
  myAjax.doArrayConvert();
}
var rec = myAjax.getTextArrayAt(0);  // gets record element '0'
// or
      rec = myAjax.getTextArrayAt(myAjax.getTextArrayLength()-1);  // get last element
*/

Modification Of Delaytimer

Similar Tutorials

Hello,

I found jkmegamenu (http://www.javascriptkit.com/script/...megamenu.shtml) beneficial for my website.

As there is a delay time for hiding the menu by default, however I could not succeed for the required modification to set an delay time prior to popup the menu.

I paste the code below and marked the part that I know to set something for the delay for mouse enter, in red.

I need your advice for the modification needed to be able to apply the same delay time prior to pop up the menu.

Thanks.

Code:

jQuery.noConflict();

var jkmegamenu={

effectduration: 0, //duration of animation, in milliseconds
delaytimer: 300, //delay after mouseout before menu should be hidden, in milliseconds

//No need to edit beyond here
megamenulabels: [],
megamenus: [], //array to contain each block menu instances
zIndexVal: 1000, //starting z-index value for drop down menu
jqshimobj: null,

addshim:function(jq){
	jq(document.body).append('<IFRAME id="outlineiframeshim" src="'+(location.protocol=="https:"? 'blank.htm' : 'about:blank')+'" style="display:none; left:0; top:0; z-index:999; position:absolute; filter:progid:DXImageTransform.Microsoft.Alpha(style=0,opacity=0)" frameBorder="0" scrolling="no"></IFRAME>')
	this.jqshimobj=jq("#outlineiframeshim")
},

alignmenu:function(jq, e, megamenu_pos){
	var megamenu=this.megamenus[megamenu_pos]
	var jqanchor=megamenu.jqanchorobj
	var jqmenu=megamenu.jqmenuobj
	var menuleft=(jq(window).width()-(megamenu.offsetx-jq(document).scrollLeft())>megamenu.actualwidth)? megamenu.offsetx : megamenu.offsetx-megamenu.actualwidth+megamenu.anchorwidth //get x coord of menu
	//var menutop=(jq(window).height()-(megamenu.offsety-jq(document).scrollTop()+megamenu.anchorheight)>megamenu.actualheight)? megamenu.offsety+megamenu.anchorheight : megamenu.offsety-megamenu.actualheight
	var menutop=megamenu.offsety+megamenu.anchorheight  //get y coord of menu
	jqmenu.css({left:265+"px", top:menutop-85+"px"})
	this.jqshimobj.css({width:megamenu.actualwidth+"px", height:megamenu.actualheight+"px", left:menuleft+"px", top:menutop+"px", display:"block"})
},

showmenu:function(e, megamenu_pos){
	var megamenu=this.megamenus[megamenu_pos]
	var jqmenu=megamenu.jqmenuobj
	var jqmenuinner=megamenu.jqmenuinner
	if (jqmenu.css("display")=="none"){
		this.alignmenu(jQuery, e, megamenu_pos)
		jqmenu.css("z-index", ++this.zIndexVal)
		jqmenu.show(this.effectduration, function(){
			jqmenuinner.css('visibility', 'visible')
		})
	}
	else if (jqmenu.css("display")=="block" && e.type=="click"){ //if menu is hidden and this is a "click" event (versus "mouseout")
		this.hidemenu(e, megamenu_pos)
	}
	return false
},

hidemenu:function(e, megamenu_pos){
	var megamenu=this.megamenus[megamenu_pos]
	var jqmenu=megamenu.jqmenuobj
	var jqmenuinner=megamenu.jqmenuinner
	jqmenuinner.css('visibility', 'hidden')
	this.jqshimobj.css({display:"none", left:0, top:0})
	jqmenu.hide(this.effectduration)
},

definemenu:function(anchorid, menuid, revealtype){
	this.megamenulabels.push([anchorid, menuid, revealtype])
},

render:function(jq){
	for (var i=0, labels=this.megamenulabels[i]; i<this.megamenulabels.length; i++, labels=this.megamenulabels[i]){
		if (jq('#'+labels[0]).length!=1 || jq('#'+labels[1]).length!=1) //if one of the two elements are NOT defined, exist
			return
		this.megamenus.push({jqanchorobj:jq("#"+labels[0]), jqmenuobj:jq("#"+labels[1]), jqmenuinner:jq("#"+labels[1]).children('ul:first-child'), revealtype:labels[2], hidetimer:null})
		var megamenu=this.megamenus[i]	
		megamenu.jqanchorobj.add(megamenu.jqmenuobj).attr("_megamenupos", i+"pos") //remember index of this drop down menu
		megamenu.actualwidth=megamenu.jqmenuobj.outerWidth()
		megamenu.actualheight=megamenu.jqmenuobj.outerHeight()
		megamenu.offsetx=megamenu.jqanchorobj.offset().left
		megamenu.offsety=megamenu.jqanchorobj.offset().top
		megamenu.anchorwidth=megamenu.jqanchorobj.outerWidth()
		megamenu.anchorheight=megamenu.jqanchorobj.outerHeight()
		jq(document.body).append(megamenu.jqmenuobj) //move drop down menu to end of document
		megamenu.jqmenuobj.css("z-index", ++this.zIndexVal).hide()
		megamenu.jqmenuinner.css("visibility", "hidden")
		megamenu.jqanchorobj.bind(megamenu.revealtype=="click"? "click" : "mouseenter", function(e){
			var menuinfo=jkmegamenu.megamenus[parseInt(this.getAttribute("_megamenupos"))]
			clearTimeout(menuinfo.hidetimer) //cancel hide menu timer
			return jkmegamenu.showmenu(e, parseInt(this.getAttribute("_megamenupos")))
		})
		megamenu.jqanchorobj.bind("mouseleave", function(e){
			var menuinfo=jkmegamenu.megamenus[parseInt(this.getAttribute("_megamenupos"))]
			if (e.relatedTarget!=menuinfo.jqmenuobj.get(0) && jq(e.relatedTarget).parents("#"+menuinfo.jqmenuobj.get(0).id).length==0){ //check that mouse hasn't moved into menu object
				menuinfo.hidetimer=setTimeout(function(){ //add delay before hiding menu
					jkmegamenu.hidemenu(e, parseInt(menuinfo.jqmenuobj.get(0).getAttribute("_megamenupos")))
				}, jkmegamenu.delaytimer)
			}
		})
		 megamenu.jqmenuobj.bind("mouseenter", function(e){
			var menuinfo=jkmegamenu.megamenus[parseInt(this.getAttribute("_megamenupos"))]
			clearTimeout(menuinfo.hidetimer) //cancel hide menu timer
		}) 
		megamenu.jqmenuobj.bind("click mouseleave", function(e){
			var menuinfo=jkmegamenu.megamenus[parseInt(this.getAttribute("_megamenupos"))]
			menuinfo.hidetimer=setTimeout(function(){ //add delay before hiding menu
				jkmegamenu.hidemenu(e, parseInt(menuinfo.jqmenuobj.get(0).getAttribute("_megamenupos")))
			}, jkmegamenu.delaytimer)
		})
	} //end for loop
	if(/Safari/i.test(navigator.userAgent)){ //if Safari
		jq(window).bind("resize load", function(){
			for (var i=0; i<jkmegamenu.megamenus.length; i++){
				var megamenu=jkmegamenu.megamenus[i]
				var jqanchorisimg=(megamenu.jqanchorobj.children().length==1 && megamenu.jqanchorobj.children().eq(0).is('img'))? megamenu.jqanchorobj.children().eq(0) : null
				if (jqanchorisimg){ //if anchor is an image link, get offsets and dimensions of image itself, instead of parent A
					megamenu.offsetx=jqanchorisimg.offset().left
					megamenu.offsety=jqanchorisimg.offset().top
					megamenu.anchorwidth=jqanchorisimg.width()
					megamenu.anchorheight=jqanchorisimg.height()
				}
			}
		})
	}
	else{
		jq(window).bind("resize", function(){
			for (var i=0; i<jkmegamenu.megamenus.length; i++){
				var megamenu=jkmegamenu.megamenus[i]	
				megamenu.offsetx=megamenu.jqanchorobj.offset().left
				megamenu.offsety=megamenu.jqanchorobj.offset().top
			}
		})
	}
	jkmegamenu.addshim(jq)
}

}

jQuery(document).ready(function(jq){
	jkmegamenu.render(jq)
})

Javascript Modification Help Required

Similar Tutorials

Hi gurus,

I am developing an application in which I am using a client validation library called "livevalidation". When you attach with the input control it shows a message infront of the text box if you leave it empty. But I want to modify it and want to show a image (cross) infront of the text box and message below text box.

Here is the CSS file and html file.
------------------------------------

Code:

/********************************* LiveValidation *************************************/


.LV_valid {
    color:#00CC00;
 }
	
.LV_invalid {
	color:#CC0000;
}
	
.LV_validation_message
{
    clear: both;
	text-indent: 166px;
	height: 22px;
	line-height: 22px;
	font-size: 11px;
	font-weight: bold;
}

    
.LV_valid_field,
input.LV_valid_field:hover, 
input.LV_valid_field:active,
textarea.LV_valid_field:hover, 
textarea.LV_valid_field:active,
.fieldWithErrors input.LV_valid_field,
.fieldWithErrors textarea.LV_valid_field {
    border: 1px solid #00CC00;
}
    
.LV_invalid_field, 
input.LV_invalid_field:hover, 
input.LV_invalid_field:active,
textarea.LV_invalid_field:hover, 
textarea.LV_invalid_field:active,
.fieldWithErrors input.LV_invalid_field,
.fieldWithErrors textarea.LV_invalid_field {
    border: 1px solid #CC0000;
}

HTML
------
Code:

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <script src="livevalidation.js" type="text/javascript"></script>
    <link href="StyleSheet.css" rel="stylesheet" type="text/css" />
</head>
<body>
<form id="create_account" action="">
           Say hello: 
    
           <input id="sayHello" type="text" /> 
           
     <script type="text/javascript">
              var sayHello = new LiveValidation('sayHello', { validMessage: 'Hey there!', wait: 500 });
              sayHello.add(Validate.Presence, { failureMessage: "Don't just ignore me, I wanna be your friend!" });
          </script>
  </form>
</body>

</html>

For livevalidation javascript (.js) i cannot paste here as its quite big and forums is not allowing me paste it so kindly get it from here which I need to modify.

here is the link.
----------------
http://livevalidation.com/javascript..._standalone.js

In the above file there is a function called "createMessageSpan" I've tried to modify it as I am sure this is the function which needs to be modified but how to do it that i dont know as i am not a java specialist.

Please help I would really appreciate.

Josh

Image Map, Tooltips Modification

Similar Tutorials

Hi.

I have an interactive house on my website with an image map that different areas link to pages when clicked on. A short title when mouse hovers over.

I want to make this look better, better display of text when mouse hovers over, and textbox below image that gives a descrpition of the area selected.

Does anyone have a simple way I could do this?

I am using wordpress.

Thanks, James

Javascript Widget Modification

Similar Tutorials

Hello, Im a coding noob and trying to make this widget display in 3 columns. Can some one help me? I am able to do it with simple css modifications, but the container still only shows up as 1 column rather than 3. Any ideas?
Code:

      <!-- Show static HTML/CSS as a placeholder in case js is not enabled - javascript include will override this if things work -->
      <style type="text/css" media="screen">
  .gr_custom_container_1318614690 {
    /* customize your Goodreads widget container here*/
    border: 1px solid gray;
    -moz-border-radius:10px;
    -webkit-border-radius:10px;
    padding: 10px 5px 10px 5px;
    background-color: #FFFFFF;          
    color: #000000;          
    width: 300px
  }
  .gr_custom_header_1318614690 {
    /* customize your Goodreads header here*/
    border-bottom: 1px solid gray;
    width: 100%;
    margin-bottom: 5px;
    text-align: center;
    font-size: 120%
  }
  .gr_custom_each_container_1318614690 {
    /* customize each individual book container here */
    width: 100%;
    clear: both;
    margin-bottom: 10px;
    overflow: auto;
    padding-bottom: 4px;
    border-bottom: 1px solid #aaa;
  }
  .gr_custom_book_container_1318614690 { 
    /* customize your book covers here */
    overflow: hidden;
    height: 60px;
    
      float: left;
      margin-right: 4px;
      width: 39px;
      }
  .gr_custom_author_1318614690 {
    /* customize your author names here */
    font-size: 10px;
  }
  .gr_custom_tags_1318614690 {
    /* customize your tags here */
    font-size: 10px;
    color: gray;
  }
  .gr_custom_rating_1318614690 {
    /* customize your rating stars here */
    float: right;
  }
</style>

      <div id="gr_custom_widget_1318614690">
            <div class="gr_custom_container_1318614690">
    <h2 class="gr_custom_header_1318614690">
    <a href="http://www.goodreads.com/review/list/6131699-kevin?shelf=read&amp;utm_medium=api&amp;utm_source=custom_widget" style="text-decoration: none;">Kevin's bookshelf: read</a>
    </h2>
            <div class="gr_custom_each_container_1318614690">
        
          <div class="gr_custom_book_container_1318614690">
            <a href="http://www.goodreads.com/review/show/202292893?utm_medium=api&amp;utm_source=custom_widget" title="The Great Gatsby"><img alt="The Great Gatsby" border="0" src="http://photo.goodreads.com/books/1273944449s/4671.jpg" /></a>
          </div>
        
        
          <div class="gr_custom_rating_1318614690">
            <img alt="3 of 5 stars" height="15" src="http://d16kthk4voxb3t.cloudfront.net/images/layout/stars/red_star_3_of_5.png?1318545374" title="3 of 5 stars, liked it" width="75" />
          </div>
        
        
          <div class="gr_custom_title_1318614690">
            <a href="http://www.goodreads.com/review/show/202292893?utm_medium=api&amp;utm_source=custom_widget">The Great Gatsby</a>
          </div>
        
        
          <div class="gr_custom_author_1318614690">
            by <a href="http://www.goodreads.com/author/show/3190.F_Scott_Fitzgerald">F. Scott Fitzgerald</a>
          </div>
        
        
        
      </div>
            <div class="gr_custom_each_container_1318614690">
        
          <div class="gr_custom_book_container_1318614690">
            <a href="http://www.goodreads.com/review/show/202292900?utm_medium=api&amp;utm_source=custom_widget" title="Where the Sidewalk Ends"><img alt="Where the Sidewalk Ends" border="0" src="http://photo.goodreads.com/books/1168052448s/30119.jpg" /></a>
          </div>
        
        
          <div class="gr_custom_rating_1318614690">
            <img alt="5 of 5 stars" height="15" src="http://dkt27ch3b0vq7.cloudfront.net/images/layout/stars/red_star_5_of_5.png?1318545374" title="5 of 5 stars, it was amazing" width="75" />
          </div>
        
        
          <div class="gr_custom_title_1318614690">
            <a href="http://www.goodreads.com/review/show/202292900?utm_medium=api&amp;utm_source=custom_widget">Where the Sidewalk Ends</a>
          </div>
        
        
          <div class="gr_custom_author_1318614690">
            by <a href="http://www.goodreads.com/author/show/435477.Shel_Silverstein">Shel Silverstein</a>
          </div>
        
        
        
      </div>
            <div class="gr_custom_each_container_1318614690">
        
          <div class="gr_custom_book_container_1318614690">
            <a href="http://www.goodreads.com/review/show/202292913?utm_medium=api&amp;utm_source=custom_widget" title="The Alchemist"><img alt="The Alchemist" border="0" src="http://photo.goodreads.com/books/1287827991s/865.jpg" /></a>
          </div>
        
        
          <div class="gr_custom_rating_1318614690">
            <img alt="5 of 5 stars" height="15" src="http://dkt27ch3b0vq7.cloudfront.net/images/layout/stars/red_star_5_of_5.png?1318545374" title="5 of 5 stars, it was amazing" width="75" />
          </div>
        
        
          <div class="gr_custom_title_1318614690">
            <a href="http://www.goodreads.com/review/show/202292913?utm_medium=api&amp;utm_source=custom_widget">The Alchemist</a>
          </div>
        
        
          <div class="gr_custom_author_1318614690">
            by <a href="http://www.goodreads.com/author/show/566.Paulo_Coelho">Paulo Coelho</a>
          </div>
        
        
        
      </div>
            <div class="gr_custom_each_container_1318614690">
        
          <div class="gr_custom_book_container_1318614690">
            <a href="http://www.goodreads.com/review/show/202292927?utm_medium=api&amp;utm_source=custom_widget" title="Slaughterhouse-Five"><img alt="Slaughterhouse-Five" border="0" src="http://photo.goodreads.com/books/1316813479s/4981.jpg" /></a>
          </div>
        
        
          <div class="gr_custom_rating_1318614690">
            <img alt="4 of 5 stars" height="15" src="http://d2owxupnsl35mn.cloudfront.net/images/layout/stars/red_star_4_of_5.png?1318545374" title="4 of 5 stars, really liked it" width="75" />
          </div>
        
        
          <div class="gr_custom_title_1318614690">
            <a href="http://www.goodreads.com/review/show/202292927?utm_medium=api&amp;utm_source=custom_widget">Slaughterhouse-Five</a>
          </div>
        
        
          <div class="gr_custom_author_1318614690">
            by <a href="http://www.goodreads.com/author/show/2778055.Kurt_Vonnegut">Kurt Vonnegut</a>
          </div>
        
        
        
      </div>
            <div class="gr_custom_each_container_1318614690">
        
          <div class="gr_custom_book_container_1318614690">
            <a href="http://www.goodreads.com/review/show/202292969?utm_medium=api&amp;utm_source=custom_widget" title="Of Mice and Men"><img alt="Of Mice and Men" border="0" src="http://photo.goodreads.com/books/1309211906s/890.jpg" /></a>
          </div>
        
        
          <div class="gr_custom_rating_1318614690">
            <img alt="3 of 5 stars" height="15" src="http://d16kthk4voxb3t.cloudfront.net/images/layout/stars/red_star_3_of_5.png?1318545374" title="3 of 5 stars, liked it" width="75" />
          </div>
        
        
          <div class="gr_custom_title_1318614690">
            <a href="http://www.goodreads.com/review/show/202292969?utm_medium=api&amp;utm_source=custom_widget">Of Mice and Men</a>
          </div>
        
        
          <div class="gr_custom_author_1318614690">
            by <a href="http://www.goodreads.com/author/show/585.John_Steinbeck">John Steinbeck</a>
          </div>
        
        
        
      </div>
            <div class="gr_custom_each_container_1318614690">
        
          <div class="gr_custom_book_container_1318614690">
            <a href="http://www.goodreads.com/review/show/202292999?utm_medium=api&amp;utm_source=custom_widget" title="Lord of the Flies"><img alt="Lord of the Flies" border="0" src="http://photo.goodreads.com/books/1165637417s/7624.jpg" /></a>
          </div>
        
        
          <div class="gr_custom_rating_1318614690">
            <img alt="4 of 5 stars" height="15" src="http://d2owxupnsl35mn.cloudfront.net/images/layout/stars/red_star_4_of_5.png?1318545374" title="4 of 5 stars, really liked it" width="75" />
          </div>
        
        
          <div class="gr_custom_title_1318614690">
            <a href="http://www.goodreads.com/review/show/202292999?utm_medium=api&amp;utm_source=custom_widget">Lord of the Flies</a>
          </div>
        
        
          <div class="gr_custom_author_1318614690">
            by <a href="http://www.goodreads.com/author/show/306.William_Golding">William Golding</a>
          </div>
        
        
        
      </div>
    <br style="clear: both"/>
  <center>
    <a href="http://www.goodreads.com/"><img src="http://www.goodreads.com/images/widget/widget_logo.gif" alt="goodreads.com" style="border:0;" /></a>
  </center>
  <noscript>
    Share <a href="http://www.goodreads.com">book reviews</a> and ratings with Kevin, and even join a <a href="http://www.goodreads.com/group/">book club</a> on Goodreads.
  </noscript>
  </div>

      </div>
      <script src="http://www.goodreads.com/review/custom_widget/6131699.Kevin's%20bookshelf:%20read?cover_position=left&amp;cover_size=small&amp;num_books=6&amp;order=a&amp;shelf=read&amp;show_author=1&amp;show_cover=1&amp;show_rating=1&amp;show_review=1&amp;show_tags=1&amp;show_title=1&amp;sort=date_added&amp;widget_bg_color=FFFFFF&amp;widget_bg_transparent=&amp;widget_border_width=1&amp;widget_id=1318614690&amp;widget_text_color=000000&amp;widget_title_size=medium&amp;widget_width=medium" type="text/javascript" charset="utf-8"></script>

Google Map Speed Up

Similar Tutorials

Hello. I have a problem. I use google map to show some points. I have to show all points for some region, and number of points gets to 4.000. So it takes some minutes to show all points.
I use gif image-> size: 400 bytes

I found http://fundrace.huffingtonpost.com/ and it takes only couple of seconds to load more 1000 markes.

Does someone know how to resolve this? Thanks

Var Speed In Jquery??

Similar Tutorials

Hello,

I'm working on a rotator and I'm needing to slow it down. I think I would use var speed right? How would I use it in this script?

<script type="text/javascript" src="http://cloud.github.com/downloads/malsup/cycle/jquery.cycle.all.latest.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$('.slideshow').cycle({
fx: 'fade' });
});
</script>

Ticker Speed Ie7 Vs Ie8?!?!

Similar Tutorials

I have this horizontal news ticker which works just perfect in ie7 regarding to speed, but when looking at the same page in ie8 the speed is very slow... Has anybody else encountered this, and if yes... How do I solve this?

Code:

initialize: function(element, options) {
		this.setOptions({
			marHeight: 18,
			marWidth: 565,
			steps: 20,
			speed: 20,
			direction: 'left',
			pauseOnOver: true,
			pauseOnContainerOver: true
	    }, options);
	    this.timer = null;
	    this.textElement = null;
	    this.mooqueeElement = element;
	    this.constructMooquee();
	}

Thanks in advance :-)

Js Breadcrumb Script - Need Help W/slight Modification..

Similar Tutorials

Hello,

I am using the following javascript breadcumb script (found here http://www.javascriptsource.com/navi...eadcrumbs.html )

It works perfectly, except I'm trying to figure out how to remove and replace the "dash" ( - ) character with a space?

Code:

function breadcrumbs() {
  sURL = new String;
  bits = new Object;
  var x = 0;
  var stop = 0;
  var output = "<div class=topnav><a href=/>Home</a> > ";

  sURL = location.href;
  sURL = sURL.slice(8,sURL.length);
  chunkStart = sURL.indexOf("/");
  sURL = sURL.slice(chunkStart+1,sURL.length)

  while(!stop){
    chunkStart = sURL.indexOf("/");
    if (chunkStart != -1){
      bits[x] = sURL.slice(0,chunkStart)
      sURL = sURL.slice(chunkStart+1,sURL.length);
    } else {
      stop = 1;
    }
    x++;
  }

  for(var i in bits){
    output += "<a href=\"";
    for(y=1;y<x-i;y++){
      output += "../";
    }
    output += bits[i] + "/\">" + bits[i] + "</a> > ";
  }
  document.write(output + document.title);
  document.write("</div>");
  }

Any help would be greatly appreciated.

Thank you!

Modification To Lytebox Info Call

Similar Tutorials

I'm working on a website for a freelance writer. I've used a lytebox mod to open a modal dialogue box that shows a scan of each magazine article. The code allows for an "info" button at the bottom of the window, which when clicked calls a page info.php, and populates that page with text from an [info] variable on the main page.

My question is this. I'd like to use the "info" button to call entire articles in text format from a separate php page. I don't want to insert these long articles into the main page. Is there an easy way to do this in the code?

The info.php page code follows:

<div class="info"><?php
if (isset($_GET['info'])){
$text = $_GET['info'];
$text = str_replace('<br/>',"\n",$text);
} else {
$text = 'This page is showing text from GET "info" variable';
}
echo $text;
?></div>

The entire info.php page is he
http://www.mimiread.com/info.php

The main lytebox.js page that I'm using is he
http://www.mimiread.com/lytebox.js

The code line that calls this from the main page:
<a href="images/ttlnob-cover.jpg" rel="lytebox[essays-ttlnob]" rev="[info]ttlnob.html[/info]" title=""><img src="images/essays-ttlnob.jpg" border="0" alt="house beautiful, the trying to leave new orleans blues" /></a>

Any help would be appreciated.

Mouse Speed Onmouseover/out

Similar Tutorials

I have a piece of raw code. I want to make some images greater/smaller onmouseover/onmouseout, in a graduate mode, on using some independent setTimeout objects which are to be started/clear . It works ok if the mouse goes up and down at a reasonable speed. But if the movement is fast, the onmouseout looks to fail in firing (and some images remain on their bigger stage), which is somehow weird. Where could be the mistake? What did I make wrong (except that I might have had done that with Flash)? Any thoughts?

You have in the attachment (see test.zip) the full example, with the used images, as well.

Code:
Code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta http-equiv="Content-Style-Type" content="text/css">
<meta http-equiv="Content-Script-Type" content="text/javascript">
<style type="text/css">
img{
width:144px;
height:36px;
cursor:pointer;
}
</style>
<script type="text/javascript">
var big1,big2,big3,small1,small2,small3, step=1;
function bigPic1(obj,w,h){
w+=4;h++;
obj.style.width=w+'px';
obj.style.height=h+'px';
if(h<55){big1=setTimeout(function(){bigPic1(obj,w,h)},step)}
}
function smallPic1(obj,w,h){
w-=4;h--;
obj.style.width=w+'px';
obj.style.height=h+'px';
if(h>36){small1=setTimeout(function(){smallPic1(obj,w,h)},step)}
}
function bigPic2(obj,w,h){
w+=4;h++;
obj.style.width=w+'px';
obj.style.height=h+'px';
if(h<55){big2=setTimeout(function(){bigPic2(obj,w,h)},step)}
}
function smallPic2(obj,w,h){
w-=4;h--;
obj.style.width=w+'px';
obj.style.height=h+'px';
if(h>36){small2=setTimeout(function(){smallPic2(obj,w,h)},step)}
}
function bigPic3(obj,w,h){
w+=4;h++;
obj.style.width=w+'px';
obj.style.height=h+'px';
if(h<55){big3=setTimeout(function(){bigPic3(obj,w,h)},step)}
}
function smallPic3(obj,w,h){
w-=4;h--;
obj.style.width=w+'px';
obj.style.height=h+'px';
if(h>36){small3=setTimeout(function(){smallPic3(obj,w,h)},step)}
}
function setAtt(){
var allImg=document.getElementById('menu').getElementsByTagName('img'), img, i=0;
while(img=allImg[i++]){
img.style.width='144px';
img.style.height='36px';
img.ind=i;
img.onmouseover=function(){
if('small'+this.ind){clearTimeout('small'+this.ind)};
window['bigPic'+this.ind](this,parseInt(this.style.width),parseInt(this.style.height))
};
img.onmouseout=function(){
if('big'+this.ind){clearTimeout('big'+this.ind)};
window['smallPic'+this.ind](this,parseInt(this.style.width),parseInt(this.style.height))
};
}
}
onload=setAtt
</script>
</head>
<body>
<div id="menu">
	<div>
    	<img src="01.png" width="144" height="36" border="0" alt="">
	</div>
    <br>
	<br>
    <div>
    	<img src="02.png" width="144" height="36" border="0" alt="">
	</div>
	<br>
	<br>
    <div>
    	<img src="03.png" width="144" height="36" border="0" alt="">
	</div>
</div>
</body>
</html>

Modification Of Multiple Dynamic Combo Boxes

Similar Tutorials

Hi all, please help...
There is a small, but very usability script - Multiple Dynamic Combo Boxes by Elviro Mirko (http://www.javascriptkit.com/script/...plecombo.shtml). Since there are many versions of this script. One of them, which I did.

Code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title> New Document </title>
<script type="text/javascript">
<!--

/*
*** Multiple dynamic combo boxes
*** by Mirko Elviro, 9 Mar 2005
*** Script featured and available on JavaScript Kit (http://www.javascriptkit.com)
***
***Please do not remove this comment
*/

// This script supports an unlimited number of linked combo boxed
// Their id must be "combo_0", "combo_1", "combo_2" etc.
// Here you have to put the data that will fill the combo boxes
// ie. data_2_1 will be the first option in the second combo box
// when the first combo box has the second option selected


// first combo box //
data_1 = new Option("All Models", "#");
data_2 = new Option("Model 1", "#");
data_3 = new Option("Model 2", "#");


// second combo box //
//All
data_1_1 = new Option("All Types", "#");
data_1_2 = new Option("Type 1", "#");
data_1_3 = new Option("Type 2", "#");
//Model 1
data_2_1 = new Option("All Types", "#");
data_2_2 = new Option("Type 1", "#");
data_2_3 = new Option("Type 2", "#");
//Model 2
data_3_1 = new Option("All Types", "#");
data_3_2 = new Option("Type 1", "#");
data_3_3 = new Option("Type 2", "#");


// third combo box //
//All Models
data_1_1_1 = new Option("All Sizes", "#");
data_1_1_2 = new Option("Size 1", "#");
data_1_1_3 = new Option("Size 2", "#");

data_1_2_1 = new Option("All Sizes", "#");
data_1_2_2 = new Option("Size 1", "#");
data_1_2_3 = new Option("Size 2", "#");

data_1_3_1 = new Option("All Sizes", "#");
data_1_3_2 = new Option("Size 1", "#");
data_1_3_3 = new Option("Size 2", "#");

//Model 1
data_2_1_1 = new Option("All Sizes", "#");
data_2_1_2 = new Option("Size 1", "#");
data_2_1_3 = new Option("Size 2", "#");

data_2_2_1 = new Option("All Sizes", "#");
data_2_2_2 = new Option("Size 1", "#");
data_2_2_3 = new Option("Size 2", "#");

data_2_3_1 = new Option("All Sizes", "#");
data_2_3_2 = new Option("Size 1", "#");
data_2_3_3 = new Option("Size 2", "#");

//Model 2
data_3_1_1 = new Option("All Sizes", "#");
data_3_1_2 = new Option("Size 1", "#");
data_3_1_3 = new Option("Size 2", "#");

data_3_2_1 = new Option("All Sizes", "#");
data_3_2_2 = new Option("Size 1", "#");
data_3_2_3 = new Option("Size 2", "#");

data_3_3_1 = new Option("All Sizes", "#");
data_3_3_2 = new Option("Size 1", "#");
data_3_3_3 = new Option("Size 2", "#");


// fourth combo box //
//All Models
data_1_1_1_1 = new Option("All color","http://special.link");
data_1_1_1_2 = new Option("Color 1","http://special.link");
data_1_1_1_3 = new Option("Color 2","http://special.link");

data_1_1_2_1 = new Option("All color","http://special.link");
data_1_1_2_2 = new Option("Color 1","http://special.link");
data_1_1_2_3 = new Option("Color 2","http://special.link");

data_1_1_3_1 = new Option("All color","http://special.link");
data_1_1_3_2 = new Option("Color 1","http://special.link");
data_1_1_3_3 = new Option("Color 2","http://special.link");

data_1_2_1_1 = new Option("All color","http://special.link");
data_1_2_1_2 = new Option("Color 1","http://special.link");
data_1_2_1_3 = new Option("Color 2","http://special.link");

data_1_2_2_1 = new Option("All color","http://special.link");
data_1_2_2_2 = new Option("Color 1","http://special.link");
data_1_2_2_3 = new Option("Color 2","http://special.link");

data_1_2_3_1 = new Option("All color","http://special.link");
data_1_2_3_2 = new Option("Color 1","http://special.link");
data_1_2_3_3 = new Option("Color 2","http://special.link");

data_1_3_1_1 = new Option("All color","http://special.link");
data_1_3_1_2 = new Option("Color 1","http://special.link");
data_1_3_1_3 = new Option("Color 2","http://special.link");

data_1_3_2_1 = new Option("All color","http://special.link");
data_1_3_2_2 = new Option("Color 1","http://special.link");
data_1_3_2_3 = new Option("Color 2","http://special.link");

data_1_3_3_1 = new Option("All color","http://special.link");
data_1_3_3_2 = new Option("Color 1","http://special.link");
data_1_3_3_3 = new Option("Color 2","http://special.link");

//All Model 1
data_2_1_1_1 = new Option("All color","http://special.link");
data_2_1_1_2 = new Option("Color 1","http://special.link");
data_2_1_1_3 = new Option("Color 2","http://special.link");

data_2_1_2_1 = new Option("All color","http://special.link");
data_2_1_2_2 = new Option("Color 1","http://special.link");
data_2_1_2_3 = new Option("Color 2","http://special.link");

data_2_1_3_1 = new Option("All color","http://special.link");
data_2_1_3_2 = new Option("Color 1","http://special.link");
data_2_1_3_3 = new Option("Color 2","http://special.link");

data_2_2_1_1 = new Option("All color","http://special.link");
data_2_2_1_2 = new Option("Color 1","http://special.link");
data_2_2_1_3 = new Option("Color 2","http://special.link");

data_2_2_2_1 = new Option("All color","http://special.link");
data_2_2_2_2 = new Option("Color 1","http://special.link");
data_2_2_2_3 = new Option("Color 2","http://special.link");

data_2_2_3_1 = new Option("All color","http://special.link");
data_2_2_3_2 = new Option("Color 1","http://special.link");
data_2_2_3_3 = new Option("Color 2","http://special.link");

data_2_3_1_1 = new Option("All color","http://special.link");
data_2_3_1_2 = new Option("Color 1","http://special.link");
data_2_3_1_3 = new Option("Color 2","http://special.link");

data_2_3_2_1 = new Option("All color","http://special.link");
data_2_3_2_2 = new Option("Color 1","http://special.link");
data_2_3_2_3 = new Option("Color 2","http://special.link");

data_2_3_3_1 = new Option("All color","http://special.link");
data_2_3_3_2 = new Option("Color 1","http://special.link");
data_2_3_3_3 = new Option("Color 2","http://special.link");

//All Model 2
data_3_1_1_1 = new Option("All color","http://special.link");
data_3_1_1_2 = new Option("Color 1","http://special.link");
data_3_1_1_3 = new Option("Color 2","http://special.link");

data_3_1_2_1 = new Option("All color","http://special.link");
data_3_1_2_2 = new Option("Color 1","http://special.link");
data_3_1_2_3 = new Option("Color 2","http://special.link");

data_3_1_3_1 = new Option("All color","http://special.link");
data_3_1_3_2 = new Option("Color 1","http://special.link");
data_3_1_3_3 = new Option("Color 2","http://special.link");

data_3_2_1_1 = new Option("All color","http://special.link");
data_3_2_1_2 = new Option("Color 1","http://special.link");
data_3_2_1_3 = new Option("Color 2","http://special.link");

data_3_2_2_1 = new Option("All color","http://special.link");
data_3_2_2_2 = new Option("Color 1","http://special.link");
data_3_2_2_3 = new Option("Color 2","http://special.link");

data_3_2_3_1 = new Option("All color","http://special.link");
data_3_2_3_2 = new Option("Color 1","http://special.link");
data_3_2_3_3 = new Option("Color 2","http://special.link");

data_3_3_1_1 = new Option("All color","http://special.link");
data_3_3_1_2 = new Option("Color 1","http://special.link");
data_3_3_1_3 = new Option("Color 2","http://special.link");

data_3_3_2_1 = new Option("All color","http://special.link");
data_3_3_2_2 = new Option("Color 1","http://special.link");
data_3_3_2_3 = new Option("Color 2","http://special.link");

data_3_3_3_1 = new Option("All color","http://special.link");
data_3_3_3_2 = new Option("Color 1","http://special.link");
data_3_3_3_3 = new Option("Color 2","http://special.link");


// other parameters

displaywhenempty="";
valuewhenempty=-1;

displaywhennotempty="-select-";
valuewhennotempty=0;


function change(currentbox) {
	numb = currentbox.id.split("_");
	currentbox = numb[1];

	i=parseInt(currentbox)+1;

	// I empty all combo boxes following the current one

	while (document.getElementById("combo_"+i)) {
		son = document.getElementById("combo_"+i);
		// I empty all options except the first one (it isn't allowed)
		for (m=son.options.length-1; m>0; m--) son.options[m]=null;
		// I reset the first option
		son.options[0]=new Option(displaywhenempty,valuewhenempty);
		i++;
	}


	// now I create the string with the "base" name ("stringa"), ie. "data_1_0"
	// to which I'll add _0,_1,_2,_3 etc to obtain the name of the combo box to fill

	stringa='data';
	i=0;
	while (document.getElementById("combo_"+i)) {
		stringa=stringa+'_'+document.getElementById("combo_"+i).selectedIndex;
		if (i==currentbox) break;
		i++;
	}


	// filling the "son" combo (if exists)

	following=parseInt(currentbox)+1;

	if (document.getElementById("combo_"+following)) {
		son = document.getElementById("combo_"+following);
		stringa=stringa+"_";
		i=0;
		while ((eval("typeof("+stringa+i+")!='undefined'")) || (i==0)) {

			// if there are no options, I empty the first option of the "son" combo
			// otherwise I put "-select-" in it

			if ((i==0) && eval("typeof("+stringa+"0)=='undefined'"))
				if (eval("typeof("+stringa+"1)=='undefined'"))
					son.options[0]=new Option(displaywhenempty,valuewhenempty);
				else
					son.options[0]=new Option(displaywhennotempty,valuewhennotempty);
			else
				son.options[i]=new Option(eval(stringa+i+".text"),eval(stringa+i+".value"));
			i++;
		}
		//son.focus()
		i=1;
		combostatus='';
		cstatus=stringa.split("_");
		while (cstatus[i]) {
			combostatus=combostatus+cstatus[i];
			i++;
		}
		return combostatus;
	}
}


function go(elementName){
	var newUrl=document.forms[0].elements[elementName].options[document.forms[0].elements[elementName].selectedIndex].value;
	if(newUrl.indexOf("http://")>=0){//rudamentary url checker! So don't go to a blank page if select box not populated.
		location.href=newUrl;
	}
}
//-->
</script>
</head>
<body>

<form>
Model:
<br />
<select name="combo0" id="combo_0" onChange="change(this);" style="width:200px;">
<option value="value1">-select-</option>
<option value="value2">All Models</option>
<option value="value3">Model 1</option>
<option value="value4">Model 2</option>
</select>
<br />
Type:
<br />
<select name="combo1" id="combo_1" onChange="change(this)" style="width:200px;">
<option value="value1"> </option>
</select>
<br />
Size:
<br />
<select name="combo2" id="combo_2" onChange="change(this);" style="width:200px;">
<option value="value1"> </option>
</select>
<br />
Color:
<br />
<select name="combo3" id="combo_3" onChange="change(this);" style="width:200px;">
<option value="value1"> </option> 
<br />
<input type="button" value="Go" onclick="go('combo3')">
<!-- could be changed for onchange event handler on select box -->

</select>

</form>

<p align="center"><font face="arial" size="-2">This free script provided by</font><br>
<font face="arial, helvetica" size="-2"><a href="http://javascriptkit.com">JavaScript
Kit</a></font></p>
</body>
</html>

But I need to when you first start the script immediately showed the first value and its associated down decaying values without - select -

immediately show combo first values

All Models
All Types
All Sizes
All Сolor

(and after next for various behaviors the user's manipulation choice)

**Or are there any other JS solutions that satisfy my request

I would be grateful for any aid....

Logic Error On Limiting The Modification To The Maxvalue

Similar Tutorials

In my previous post, I asked how to create a function that would allow me to add to or subtract from a maxvalue, and thankfully I got help regarding that. However, something's got me stumped for the past few weeks that I still can't resolve...

This is the relevant code:
Code:

<html>
<head>
<script type="text/javascript" language="Javascript">
function chgAdv(btn)
{
	var form = btn.form;
	var newqty = parseInt(btn.value);
	var maxqty = form.maxqty;
	var maxadv = form.maxadv;
	
	if (eval("btn.checked") == true && parseInt(maxadv.value) + newqty <= 15) {
		var newmax = parseInt(maxqty.value) - newqty;
		var newadv = parseInt(maxadv.value) + newqty;
	}
	else if (eval("btn.checked") == false && parseInt(maxadv.value) - newqty >= 0) {
		var newmax = parseInt(maxqty.value) + newqty;
		var newadv = parseInt(maxadv.value) - newqty;
	}
	else {
		var newmax = parseInt(maxqty.value);
		var newadv = parseInt(maxadv.value);
	}
	
	if ( newadv >= 0 && newmax >= 0) {
		maxqty.value = newmax;
		maxadv.value = newadv;
    }
}

function chgDis(btn) {
	var form = btn.form;
	var newqty = parseInt(btn.value);
	var maxqty = form.maxqty;
	var maxdis = form.maxdis;
	
	if (eval("btn.checked") == true && parseInt(maxdis.value) + newqty <= 10) {
		var newmax = parseInt(maxqty.value) + newqty;
		var newdis = parseInt(maxdis.value) + newqty;
	}
	else if (eval("btn.checked") == false && parseInt(maxdis.value) - newqty >= 0) {
		var newmax = parseInt(maxqty.value) - newqty;
		var newdis = parseInt(maxdis.value) - newqty;
	}
	else {
		var newmax = parseInt(maxqty.value);
		var newdis = parseInt(maxdis.value);
	}
	if (newdis >= 0 && newmax >= 0) {
		maxqty.value = newmax;
		maxdis.value = newdis;
	}
}
</script>
<link rel="stylesheet" type="text/css" href="styles.css">
</head>
<body>
<form name="f1">
<b>Advantages</b> (<input type="text" class="RO" name="maxadv" value="0" />)<br />
<input type="checkbox" class="RO" name="Absolute Direction" onclick="chgAdv(this);" value="2" />Absolute Direction<br />
<input type="checkbox" class="RO" name="Allies" onclick="chgAdv(this);" value="3" />Allies<br />
<hr>
<b>Disadvantages</b> (<input type="text" class="RO" name="maxdis" value="0" />)<br />
<input type="checkbox" class="RO" name="Antisocial" onclick="chgDis(this);" value="2" />Antisocial<br />
<input type="checkbox" class="RO" name="Ascetic" onclick="chgDis(this);" value="4" />Ascetic<br />

max quantity: <input type="text" readonly class="RO" name="maxqty" value="40" />
</form>
</body>
</html>

styles.css is simply:
Code:

input.RO {
    border: none; 
    width: 40px;
    text-align: center;
}

As it stands, it works as long as the total value is less than or equal to the limit (for advantages it's 15, for disadvantages it's 10). However, the moment it goes past the limit -- for instance, if you change Antisocial's value from 2 to 7, or if you add several additional checkboxes with any values -- the whole thing starts going crazy; specifically, maxvalue doesn't revert to 40 when the all the checkboxes are unchecked.

What I'd want to happen is that the user cannot select or apply advantages or disadvantages if the maximum advantage is greater than 15 or the maximum disadvantages is greater than 10.

I'm thinking that a button for adding disadvantage points to/subtracting advantage points from the maxvalue (that becomes disabled if the user goes past his limit on advantages/disadvantages) is useful at this point, but I'm really stumped on the implementation of the idea. An alternate idea of mine is that all other advantage/disadvantage checkboxes would become disabled if their value is greater than the remaining number of points, but I don't know how that is possible either.

Any and all help is greatly appreciated.

Detect Connection Speed And Redirect

Similar Tutorials

i need script will detect connection speed and redirect to a page:

Detect Connection Speed And Redirect

Similar Tutorials

In the home page (index.html) i have a flash intro. The first time a user sees the website, the intro should play. Once he goes to another page (about_us or contact_us) and comes back to the home page, it should show a different swf (the version without the intro) - i have created two swf files. I need to know how to change them when the user has already seen the intro or was in the home page before. When i googled, i found something on cookies. I have no clue on how to set them and change the swf file. Would be great if someone has already done this or point me to a tutorial.

i need java script.

please help!!!!!!!

Jquery Text Effect And Speed

Similar Tutorials

I have made myself an HTML Menu which is located on top of my current Flash object.

I have a question whether it really is not possible to get the same effect as 'text' has on the original "Flash Menu"

EX: www.moebelarkitekten.dk

and get the same effect over at my new HTML menu (Coded with Jquery)
EX: http://www.richyjassal.co.uk/moebelar/

Right now it is almost the same effect, but only:
OnMouseOver align text to Right
OnMouseOut text to align left

A guide, or other?

Detect Connection Speed And Redirect

Similar Tutorials

i have pasted below java script code. please check write or wrong

<script language = "JavaScript" type="text/javascript">
// Remove down to "ConnectionSpeed Detection section" if you don't want to use cookies
// If you drop a cookie it can be picked up on return by php or something else
function setCookie(name, value, expire) {
document.cookie = name + "=" + escape(value) + ((expire == null ?
"" : (";expires=" + expire.toGMTString())));
// alert('A cookie called '+name+' is now set with value: '+value); //enable to alert user of cookie
}
function getExpireDate() {
var expires = new Date();
expires.setTime((new Date().getTime() + 1000 * 60 * 60 * 24 * 365));
return expires;
}
// ConnectionSpeed Detection section
var datasize = 31468; // Size of data being transferred, in Bytes
var startTime = 0;
var endTime = 0;
var date = 0;
var ctype = "";
var textMessage = "";
function calcThroughput() {
var diffTimeMilliseconds = endTime - startTime;
var diffTimeSeconds = diffTimeMilliseconds / 1000;
var bits = (datasize * 8); // convert Bytes to bits,
var kbits = bits / 1024; // convert bits to kbits
var throughput1 = kbits / (diffTimeSeconds * 100 / 100);
throughput = throughput1 * .93; // account for IP packet header overhead - averages about 7%
setCookie("MediaThroughput", throughput, getExpireDate()); // Remove to not use cookie
if (throughput < 185) { ctype = "Home.aspx"; }
if (throughput > 185) { ctype = "intro.aspx"; }

textMessage = "Bandwidth: <B>" + ctype + "</B><br>time to load: (sec): <B>" + diffTimeSeconds + "</B><BR>kbits loaded:<B> " + kbits + "</B><BR>Throughput (kbps): <B>" + throughput + "</B>"
document.location = ctype;
}
</script>
<script language = "Javascript" type="text/javascript">

</script>
</head><body>
<script language = "Javascript" type="text/javascript">
date = new Date();
endTime = date.getTime();
calcThroughput();
</script>

automatic detect default page and check to low band version go to html page or high band version go to flash page.

please help!!!!!!!!!!!!!!!!!!!!!!!!!

Ball And Paddle Game With User Input Modification

Similar Tutorials

Hello, I am very new to javascript and most programming in general, but I am trying to make a simple game with a ball and paddle. The catch is the user inputs the height, width and speed of the ball, then when the start button is hit, the program runs...

I was successfully able to make the ball bounce in a preset box (it was 500x500) but I am struggling to get the code to work when the user types in the values the ball either goes crazy or does not work. I have tried many things, but nothing has worked. the code I included is my most recent attempt. I am not asking for you guys to do the whole game for me, I would just like to know the solution to why my code is not working and any suggestions

the ball is 15x15px btw

Thanks,
thejsnoob

Code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>
<head>
<title>Untitled</title>
<style type="text/css">
.button{height: 170px};
<!--
img { position: absolute; top: 300px; left: -50px; z-index::+1;}
-->
</style>

</head>
<body>
<img src="ball.png" alt="">
<form name = "form1">
<table border = "1">
<tr>
		<td> WIDTH: </td>
		<td>  <input type="text" id = "usrWidth"/> </td>
		<td rowspan="3" align="center" valign="middle"> <input type="button" class="button" value="START" onclick="moveImg()"/> </td>
</tr>
<tr>
		<td> HEIGHT: </td>
		<td> <input type="text" id = "usrHeight"/> </td>
		
</tr>
<tr>
		<td> SPEED: </td>
		<td> <input type="text"/> </td>
		
</tr>

</table>

</form>

<tr>
<td></td>
</tr>
</table>



<script language="JavaScript" type="text/javascript">

<!--

var xDir = 1;
var yDir = -1;

var left;
var top;

var check = 1;


function moveImg() // clicks the button
{
var userWidth = document.form1.usrWidth.value;
var userHeight = document.form1.usrHeight.value;

if ( check == 1 ){
left=Math.floor(Math.random()* (userWidth + 1));
top=(Math.floor(Math.random()* (userHeight + 1)) + 220);
document.images[0].style.left = left + "px";
document.images[0].style.top = top +"px";
check = 0;
}

document.body.appendChild(rectangle(userWidth,userHeight))

        left += xDir;
				top += yDir;
       
				if ((top < 220) || (top > userHeight - 15))
					 yDir *= -1; 
				if (left > (userWidth - 15) || (left < 0))
					 xDir *= -1; 
				
				setTimeout(moveImg, 10);
}


function rectangle(w,h)
{
 var rect = document.createElement("div");
 var style = rect.style;
 style.width = w +"px";
 style.height = h +"px";
 style.left = "0px";
 style.top = "220px";
 // fixed
 style.position = "absolute";
 style.borderStyle = "solid"
 style.borderWidth = 1;
 return rect
}

//document.body.appendChild( rectangle(500,500,0,220,"","red") )

//-->
</script>
</body>
</html>

Ie7 - Site Speed Is Dead Slow. What Could Be The Problem?

Similar Tutorials

Hello Experts,

I did a website & I am having trouble wit it. In IE8, FF& Chrome, the site works perfectly. But in IE7, the site slows down very much that even the link hover effect doesn't show properly. I believe its some kind of javascript or Ajax request which is causing such delay. Can you guys please help me sort this out....

Here is the site with functionality...
http://tinyurl.com/3qkunvy

Here is the site without functionality but just the gallery is integrated...
http://tinyurl.com/439ejhk

The speed was even better before the Ajax is applied for contents.

Any solutions/fixes please...

Does Order Of Logic Comparisons Affect Speed In The Same Statment?

Similar Tutorials

was wondering if it made sense to optimize the comparison order inside an if() statement if one of the comparison targets is a function call eg:

Code:

var a = true,
    b = function() {return false;};

if (b() || a) {...}

if (a || b()) {...}

would the second statement run faster because it would theoretically never need to call b() in this situation? can the eval order be relied on? does this depend on the js engine/internal optimizations?

thanks,
Leon