NotIan

Firefox annoying outlines CURED

Just found this and thought I would share.

Ever notice those bothersome dotted outlines on focused elements in Firefox? Well as a developer you can just add this little one-liner to your CSS:

*{ outline: none; }

Problem SOLVED!

Callback Recursion?

I just thought this was an interesting use of php’s preg_replace_callback, making a function which calls itself as a callback.

  Code
  >?
    function ascii2entity($Match){
      if(!is_array($Match)){
        return preg_replace_callback(
            '/[[:ascii:]]/',
            'ascii2entity',
            $Match);
      }else{
        return '&#'.ord($Match[0]).';';
        }
      }
  $text = "Test";
  echo $text;
  echo ascii2entity($text);
  ?>

Result
Test
Test
(Test when rendered by the browser)

Strange IE Behaviour #6127

I was implementing a jQuery version of Lightbox into an SSL subsection of a website. After browsing through the set of images I would get an SSL breach warning. This is not good, so I spent an hour or so tracking it down. And turns out it’s because if you don’t return:false on a .click in jQuery, jQuery stops IE for you, but as a result Internet Explorer has a freak out and makes you download res://…navcancl.htm in the “background” but since res:// isn’t https:// it throws a seruity warning!

So I had to add an extra return false in my jQuery plugin and it worked fine.

//Throws Error:
// Assigning click events in elements to close overlay
$('#jquery-overlay,#jquery-lightbox').click(function() {
  _finish();					
  });

//No Error:
// Assigning click events in elements to close overlay
$('#jquery-overlay,#jquery-lightbox').click(function() {
  _finish();					
  return false;
  });

Zune’s New MixView — Canadian Workaround

If you’re a canadian who can’t for the life of you find MixView; do the following

Open Control Panel (in Vista) select “Regional and Language options” and switch them from Canada to United States.

This is because of the lack of a Marketplace in Canada, hopefully Microsoft will fix this soon.

Big Ass Select Boxes

Recently a client needed an upgrade to their site, it seems that one of the tools was not working because the page was trying to load 200 select boxes with 200 items each, neither Internet Explorer or Firefox were willing to take this kind of abuse; so I had to come up with a solution.

My solution Javascript! Have the select boxes only fill “on focus” (not onclick since some people might tab to it). This worked beautifully in Firefox and it worked in IE with only one hitch, you had to click, and then click again, since Internet Explorer just does stuff differently.

So what was I to do? After some searching I came to the solution:

• Fill the select box
• Set it’s style: position to absolute
• Set the select box “size” to X (X being either the number of items in the box to a  maximum of something I chose 18)
• Set up an onblur method to clean this up and reset it to size = 1
• Set up OnChange to “blur” the box.

Here is the final code:

function populate(sbox,sArray){
 var ignoreKey = sbox.options[0].value;
 var o = 1;
 for(var i=0;i<sArray.length;i++){
  if(sArray[i][0] != ignoreKey){
   sbox.options[o] = new Option(sArray[i][1],sArray[i][0]);
   o++;
   }
  } 
 sbox.style.position = ‘absolute’;
 if(sbox.options.length > 18){
  sbox.size=30;
 }else{
  sbox.size=sbox.options.length;
  }
 var y = sbox.offsetTop;
 var x = sbox.offsetLeft;
 sbox.style.left = x+’px’;
 sbox.style.top = (y-5)+’px’;
 sbox.style.zIndex = 10;
 sbox.onblur = function(){
  this.size=1;
  this.style.position = ‘static’;
  this.style.zIndex = 1;
  var temp = new Object();
  temp.value = this.options[this.selectedIndex].value;
  temp.text = this.options[this.selectedIndex].text;
  this.options.length = null;
  this.options[0] = new Option(temp.text,temp.value);
  }
 sbox.onchange = function(){ this.blur() }
 return true;
 }

ExampleArray = new Array();
ExampleArray[1] = new Array(‘1’,’One’);
ExampleArray[2] = new Array(‘2’,’Two’);

<select onfocus=”populate(this,ExampleArray)”>
 <option key=”0”>Default</option>
</select>

Et Voila!