Internet Explorer 8

IE8 Pseudo Command Fix

Internet Explorer 8 (and earlier) does not recognize some very powerful pseudo commands, such as ‘first-of-type’, ‘last-of-type’, ‘only-of-type’, ‘nth-of-type’, and ‘nth-last-of-type’ which the follow jQuery snippet fixes. IE8 does support ‘nth-child(last)’ and ‘nth-child(first)’ and other nth-child commands – also ‘last-child’ and ‘first-child.’ However, those are all dependent on the element recognizing children to parent relationships (i.e. ordered and unordered lists) and will not recognize elements simply by them being inside one of another (i.e. a div tag containing a series of other div tags… that’s when you use ‘type’ instead of ‘child.’

If you are creating an addon or have one that uses one of those commands then simply paste the following code to the Page Info > Header > JavaScript of the page (in RapidWeaver).

All credit to Keith Clark on this one – great simple fix.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
/*
 * jQuery Extra Selectors - (c) Keith Clark freely distributable under the terms of the MIT license.
 * twitter.com/keithclarkcouk
 * www.keithclark.co.uk
 */
 
(function($) {
     function getNthIndex(cur, dir) {
          var t = cur, idx = 0;
          while (cur = cur[dir] ) {
               if (t.tagName == cur.tagName) {
                    idx++;
               }
          }
          return idx;
     }
     function isNthOf(elm, pattern, dir) {
          var position = getNthIndex(elm, dir), loop;
          if (pattern == "odd" || pattern == "even") {
               loop = 2;
               position -= !(pattern == "odd");
          } else {
               var nth = pattern.indexOf("n");
               if (nth > -1) {
                    loop = parseInt(pattern, 10) || parseInt(pattern.substring(0, nth) + "1", 10);
                    position -= (parseInt(pattern.substring(nth + 1), 10) || 0) - 1;
               } else {
                    loop = position + 1;
                    position -= parseInt(pattern, 10) - 1;
               }
          }
          return (loop<0 ? position<=0 : position >= 0) && position % loop == 0
     }
     var pseudos = {
          "first-of-type": function(elm) {
               return getNthIndex(elm, "previousSibling") == 0;
          },
          "last-of-type": function(elm) { 
               return getNthIndex(elm, "nextSibling") == 0;
          },
          "only-of-type": function(elm) { 
               return pseudos["first-of-type"](elm) && pseudos["last-of-type"](elm);
          },
          "nth-of-type": function(elm, i, match) {
               return isNthOf(elm, match[3], "previousSibling");
          },
          "nth-last-of-type": function(elm, i, match) {
               return isNthOf(elm, match[3], "nextSibling");
          }                
     }
     $.extend($.expr[':'], pseudos);
}(jQuery));
Please follow & like us :)
Follow by Email
Facebook
Twitter
INSTAGRAM
Google+
http://onelittledesigner.com/rapidweaver/rapidweaver-snippets/ie8-pseudo-command-fix/">
RSS

Leave a Reply

Your email address will not be published. Required fields are marked *
You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>