you are in: codestackercodes [RSS] → tag: javascript [RSS]

[prototype] adding input:focus functionality to ie Delicious

show/hide lines
   1  Event.observe(window, 'load', function() { 
   2  var fields = $$("input"); 
   3  for (var i = 0; i fields[i].onfocus = function() {this.className += ' focused';} 
   4  fields[i].onblur = function() {this.className = this.className.replace('focused', '');} 
   5  } 
   6  }); 
   7  
   8  // in css, paste
   9  // input:focus, /* works in FF without javascript */ 
  10  // input.focused /* used by js */ 
  11  // { background-color: #f7cd72; } 
created by leozera — 18 November 2008 — get a short url — tags: hack ie6 javascript prototype embed

validate file extension Delicious

a very simple function.

show/hide lines
   1  extensions = new Array(".jpg", ".png");
   2  function limitImage(file, extensions) {
   3  	allowed = false;
   4  	if (!file) return;
   5  
   6  	while (file.indexOf("\\") != -1)
   7  	file = file.slice(file.indexOf("\\") + 1);
   8  	ext = file.slice(file.indexOf(".")).toLowerCase();
   9  	for (var i = 0; i < extensions.length; i++) {
  10  		if (extensions[i] == ext) { allowed = true; break; }
  11  	}
  12  	return allowed;
  13  }
created by leozera — 13 November 2008 — get a short url — tags: javascript validate embed

vertical align with javascript Delicious

source: http://snipplr.com/view/9321/vertically-align-within-browser-window/

show/hide lines
   1  <div id="verticalContainer">
   2  	This text will always be vertically centered inside the browser window
   3  </div>
   4  
   5  <script type="text/javascript">
   6  	function getWindowHeight() {
   7  		var windowHeight = 0;
   8  		if (typeof(window.innerHeight) == 'number') {
   9  			windowHeight = window.innerHeight;
  10  		}
  11  		else {
  12  			if (document.documentElement && document.documentElement.clientHeight) {
  13  				windowHeight = document.documentElement.clientHeight;
  14  			}
  15  			else {
  16  				if (document.body && document.body.clientHeight) {
  17  					windowHeight = document.body.clientHeight;
  18  				}
  19  			}
  20  		}
  21  		return windowHeight;
  22  	}
  23  
  24  	function setContent() {
  25  		if (document.getElementById) {
  26  			var windowHeight = getWindowHeight();
  27  			if (windowHeight > 0) {
  28  				var contentElement = document.getElementById('verticalContainer');	// Be sure to specify the correct ID
  29  				var contentHeight = contentElement.offsetHeight;
  30  				if (windowHeight - contentHeight > 0) {
  31  					contentElement.style.position = 'relative';
  32  					contentElement.style.top = ((windowHeight / 2) - (contentHeight / 2)) + 'px';
  33  				}
  34  				else {
  35  					contentElement.style.position = 'static';
  36  				}
  37  			}
  38  		}
  39  	}
  40  
  41  	window.onresize = function() {
  42  		setContent();
  43  	}
  44  
  45  	window.onload = function() {
  46  		setContent();
  47  	}
  48  </script>
created by leozera — 01 November 2008 — get a short url — tags: align javascript embed

search box onclick clear/unclear Delicious

this’s used here!

show/hide lines
   1  <script type="text/javascript">
   2      function clickclear(thisfield, defaulttext) {
   3          if (thisfield.value == defaulttext) {
   4              thisfield.value = "";
   5          }
   6      }
   7      
   8      function clickrecall(thisfield, defaulttext) {
   9          if (thisfield.value == "") {
  10              thisfield.value = defaulttext;
  11          }
  12      }
  13  </script>
  14  
  15  <input id="search" type="text" name="q" value="search" onclick="clickclear(this, 'search')" onblur="clickrecall(this,'search')"/>
created by leozera — 01 November 2008 — get a short url — tags: input javascript embed

show flickr photos with javascript Delicious

show/hide lines
   1  <script type="text/javascript">
   2  function jsonFlickrFeed(o){
   3  	var i = 0;
   4  	while(o.items[i]){
   5      	document.write('<img src="' + o.items[i].media.m + '" alt="' + o.items[i].title +'">');
   6     		i++;
   7  	}
   8  }
   9  </script>
  10  <script src="http://api.flickr.com/services/feeds/photos_public.gne?id=28203925@N08&lang=en-us&format=json" type="text/javascript"></script>
created by leozera — 07 September 2008 — get a short url — tags: flickr javascript json embed

passing extra parameters to prototype observer handlers Delicious

a simple listener: $(’myForm’).observe(‘submit’, validateMyForm) dont support extra params in the function (in the case, validateMyForm. the solution:

show/hide lines
   1  $('myForm').observe('submit', function(event) {  
   2      validateMyForm(event, param1, param2);  
   3  }); 
created by leozera — 05 August 2008 — get a short url — tags: javascript prototype embed

resize window bookmarklet Delicious

create a link with this:

show/hide lines
   1  javascript: resizeTo(800,600);
   2  
   3  javascript: resizeTo(1024,768);
created by anonymous — 05 July 2008 — get a short url — tags: bookmarklet javascript embed