You may find it easier to use @media queries (http://www.w3.org/TR/ css3-mediaqueries/) which works on Android and iphones This way you could simply put media queries in your StyleSheet tiddler and not resort to any javascript plugins (which is never perfect any how...)
On Oct 26, 5:08 am, Anomalous Underdog <[email protected]> wrote: > I want to be able to use a different stylesheet when a tiddlywiki is > viewed on a mobile device. > > I've gotten so far as to detect if the browser agent reports its using > iPhone/Android but calling refreshStyles with my own custom stylesheet > (refreshStyles("MobileStyleSheet") for example) gets called too early. > > From my tests, it seems the code to use the standard custom stylesheet > gets called after my plugin, so my MobileStyleSheet gets overriden. > > Here's my simple code so far: > > var BrowserDetect = { > init: function () { > this.browser = this.searchString(this.dataBrowser) || "An > unknown > browser"; > this.version = this.searchVersion(navigator.userAgent) > || this.searchVersion(navigator.appVersion) > || "an unknown version"; > this.OS = this.searchString(this.dataOS) || "an unknown OS"; > }, > searchString: function (data) { > for (var i=0;i<data.length;i++) { > var dataString = data[i].string; > var dataProp = data[i].prop; > this.versionSearchString = data[i].versionSearch || > data[i].identity; > if (dataString) { > if (dataString.indexOf(data[i].subString) != > -1) > return data[i].identity; > } > else if (dataProp) > return data[i].identity; > } > }, > searchVersion: function (dataString) { > var index = dataString.indexOf(this.versionSearchString); > if (index == -1) return; > return parseFloat(dataString.substring(index > +this.versionSearchString.length+1)); > }, > dataBrowser: [ > { > string: navigator.userAgent, > subString: "Chrome", > identity: "Chrome" > }, > { string: navigator.userAgent, > subString: "OmniWeb", > versionSearch: "OmniWeb/", > identity: "OmniWeb" > }, > { > string: navigator.vendor, > subString: "Apple", > identity: "Safari", > versionSearch: "Version" > }, > { > prop: window.opera, > identity: "Opera", > versionSearch: "Version" > }, > { > string: navigator.vendor, > subString: "iCab", > identity: "iCab" > }, > { > string: navigator.vendor, > subString: "KDE", > identity: "Konqueror" > }, > { > string: navigator.userAgent, > subString: "Firefox", > identity: "Firefox" > }, > { > string: navigator.vendor, > subString: "Camino", > identity: "Camino" > }, > { // for newer Netscapes (6+) > string: navigator.userAgent, > subString: "Netscape", > identity: "Netscape" > }, > { > string: navigator.userAgent, > subString: "MSIE", > identity: "Explorer", > versionSearch: "MSIE" > }, > { > string: navigator.userAgent, > subString: "Gecko", > identity: "Mozilla", > versionSearch: "rv" > }, > { // for older Netscapes (4-) > string: navigator.userAgent, > subString: "Mozilla", > identity: "Netscape", > versionSearch: "Mozilla" > } > ], > dataOS : [ > { > string: navigator.platform, > subString: "Win", > identity: "Windows" > }, > { > string: navigator.platform, > subString: "Mac", > identity: "Mac" > }, > { > string: navigator.userAgent, > subString: "iPhone", > identity: "iOS" > }, > { > string: navigator.userAgent, > subString: "Android", > identity: "Android" > }, > { > string: navigator.platform, > subString: "Linux", > identity: "Linux" > } > ] > > }; > > BrowserDetect.init(); > > //alert(BrowserDetect.OS); > > var isMobile = BrowserDetect.OS == "Android" || BrowserDetect.OS == > "iOS"; > > if (isMobile) > { > refreshStyles("MobileStyleSheet") > > > > > > > > } -- You received this message because you are subscribed to the Google Groups "TiddlyWikiDev" group. To post to this group, send email to [email protected]. To unsubscribe from this group, send email to [email protected]. For more options, visit this group at http://groups.google.com/group/tiddlywikidev?hl=en.
