1LD Tutorials & Blogs

Blog

Internet Explorer 8

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));

(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));

RapidWeaver Stack Tutorials

RapidWeaver Theme Tutorials

RapidWeaver Project Documentation

Tutorials and documentation for all 1LD Project files can be found at the link below.

See Documentation

Get the power of a framework, for the price of a theme, in the convenience of a prebuilt RapidWeaver project file

See Projects

Blog

New Release: Overlap Canvas RapidWeaver Stack

Overlap Canvas is a new tool for RapidWeaver Stacks for creating responsive overlapping layers of images, text, & content. With this stack you can create unique designs like never before in your projects. No graphic design skills needed! All stacks content can be added, positioned, rotated, & scaled within the stacks editor for an easy design process.

 

Check it out!

Latest News

Newsletter

Join our newsletter to get notified of new releases, updates, and discounts.

Subscribe

Popular Links

Free Stacks & Themes
See Order History
Product Tutorials
FAQs

© 2011 One Little Designer, 1 Little Designer (1LD)

RapidWeaver is a trademark of Realmac Software