I'm using the javascript from http://detectmobilebrowsers.com/ to see check if a browser is mobile and then use a different version of my website.
However I'd also ideally like the site to revert to desktop if a browser isn't one of the mobile ones.
I don't wanna post the whole thing because it's quite long but the function goes like this:
(function(a,b){if(/...'http://detectmobilebrowser.com/mobile');
So basically, I want 'if' to instead have a role of 'if not'. How can I accomplish this?
Shouts out to #JennaSloan in the javascript chat - the answer is to use the following:
if(!( or if(false==(
Related
I have an HTML img tag with a static HTML link.
My idea is to dynamically change that link (but not the image) based on what type of device my user is connecting from. The major types of devices I am concerned with are PC, Google/Andriod, Ios, Amazon/Andriod.
Is there an HTML/CSS/Javascript solution to this, or is php/dom/server side the only options?
Javascript/JQuery will work for you. Let's say you used the code from here to detect different mobile browsers: http://www.abeautifulsite.net/blog/2011/11/detecting-mobile-devices-with-javascript/
Then you could write something like this:
if( isMobile.iOS() || isMobile.Android() ){
$('a#mylink').attr('href', 'http://newlink.com');
}
You might consider using CSS media queries for device sizes: http://css-tricks.com/snippets/css/media-queries-for-standard-devices/
OR you could use some sort of server-side detection library such as: https://code.google.com/p/php-mobile-detect/
OR you could use javascript: What is the best way to detect a mobile device in jQuery?
I was looking into making Firefox addons, and I need some help.
Is it possible to edit an HTML page that is open in the browser with javascript?
For example:
User types in "google.com"
Addon is activated
Javascript changes contents of "google.com" to maybe say "Hello!" at the bottom.
Of course this isn't specifically what I want to do, but a push in the right direction on how to accomplish such a task would be great.
~Carpetfizz
From within a Firefox addon this is obviously possible as many extensions do this.
If you, however, simply want to modify the DOM and nothing else than I would recommend taking a look at greasemonkey. Loads of example scripts around to do this: http://userscripts.org/
And the added benefit, if written correctly they also work in Chrome and other browsers.
Yes, it is. You must find a tutorial about javascript DOM manipulation
I am looking for a way to do the following
If they are on a mobile device, it goes to -> m.domainname.com/
I want this expandable so that in the future, i can do ->
m.domainname.com/iphone or /ipad etc.
I want there to be a bypass
feature that will allow the user to bypass the mobile version of the
website and go directly to the full version (even if they are on a
smart phone).
I've seen this code in the past, but haven't been able to find it lately and want to make sure I'm doing this the best way possible.
Please give an example of the code or a place I can find the code/a tutorial on the code if possible.
If you see any other tags I didn't include this in that I should have, please add them.
Thanks
Points 1 and 2 have to be done by user-agent checks. It is relatively easy - if you're using a server-side language, you can easily look at the User-agent: header (note however that it can be spoofed!). You can find a full list at http://www.useragentstring.com/pages/useragentstring.php , sorted by browser. For instance, the Safari page has all the iPad user-agent versions.
Point 3 will be a refinement of point 1 - you need to cookie the user with their version.
So, in pure JS, that's going to be hard. Not impossible, but hard.
You can find different ways to detect if it is a mobile device here http://detectmobilebrowsers.com/. Their Javascript sample:
(function(a,b){if(/(android|bb\d+|meego).+mobile|avantgo|bada/|blackberry|blazer|compal|elaine|fennec|hiptop|iemobile|ip(hone|od)|iris|kindle|lge
|maemo|midp|mmp|netfront|opera m(ob|in)i|palm(
os)?|phone|p(ixi|re)/|plucker|pocket|psp|series(4|6)0|symbian|treo|up.(browser|link)|vodafone|wap|windows
(ce|phone)|xda|xiino/i.test(a)||/1207|6310|6590|3gso|4thp|50[1-6]i|770s|802s|a
wa|abac|ac(er|oo|s-)|ai(ko|rn)|al(av|ca|co)|amoi|an(ex|ny|yw)|aptu|ar(ch|go)|as(te|us)|attw|au(di|-m|r
|s
)|avan|be(ck|ll|nq)|bi(lb|rd)|bl(ac|az)|br(e|v)w|bumb|bw-(n|u)|c55/|capi|ccwa|cdm-|cell|chtm|cldc|cmd-|co(mp|nd)|craw|da(it|ll|ng)|dbte|dc-s|devi|dica|dmob|do(c|p)o|ds(12|-d)|el(49|ai)|em(l2|ul)|er(ic|k0)|esl8|ez([4-7]0|os|wa|ze)|fetc|fly(-|)|g1
u|g560|gene|gf-5|g-mo|go(.w|od)|gr(ad|un)|haie|hcit|hd-(m|p|t)|hei-|hi(pt|ta)|hp(
i|ip)|hs-c|ht(c(-|
||a|g|p|s|t)|tp)|hu(aw|tc)|i-(20|go|ma)|i230|iac(
|-|/)|ibro|idea|ig01|ikom|im1k|inno|ipaq|iris|ja(t|v)a|jbro|jemu|jigs|kddi|keji|kgt(
|/)|klon|kpt |kwc-|kyo(c|k)|le(no|xi)|lg(
g|/(k|l|u)|50|54|-[a-w])|libw|lynx|m1-w|m3ga|m50/|ma(te|ui|xo)|mc(01|21|ca)|m-cr|me(rc|ri)|mi(o8|oa|ts)|mmef|mo(01|02|bi|de|do|t(-|
|o|v)|zz)|mt(50|p1|v
)|mwbp|mywa|n10[0-2]|n20[2-3]|n30(0|2)|n50(0|2|5)|n7(0(0|1)|10)|ne((c|m)-|on|tf|wf|wg|wt)|nok(6|i)|nzph|o2im|op(ti|wv)|oran|owg1|p800|pan(a|d|t)|pdxg|pg(13|-([1-8]|c))|phil|pire|pl(ay|uc)|pn-2|po(ck|rt|se)|prox|psio|pt-g|qa-a|qc(07|12|21|32|60|-[2-7]|i-)|qtek|r380|r600|raks|rim9|ro(ve|zo)|s55/|sa(ge|ma|mm|ms|ny|va)|sc(01|h-|oo|p-)|sdk/|se(c(-|0|1)|47|mc|nd|ri)|sgh-|shar|sie(-|m)|sk-0|sl(45|id)|sm(al|ar|b3|it|t5)|so(ft|ny)|sp(01|h-|v-|v
)|sy(01|mb)|t2(18|50)|t6(00|10|18)|ta(gt|lk)|tcl-|tdg-|tel(i|m)|tim-|t-mo|to(pl|sh)|ts(70|m-|m3|m5)|tx-9|up(.b|g1|si)|utst|v400|v750|veri|vi(rg|te)|vk(40|5[0-3]|-v)|vm40|voda|vulc|vx(52|53|60|61|70|80|81|83|85|98)|w3c(-|
)|webc|whit|wi(g
|nc|nw)|wmlb|wonu|x700|yas-|your|zeto|zte-/i.test(a.substr(0,4)))window.location=b})(navigator.userAgent||navigator.vendor||window.opera,'http://detectmobilebrowser.com/mobile');
As you can see you can change easily the url you want them to navigate to.
A lot of sites use a simple dialog to ask the users if they want to use the normal website, or the mobile, you can do this as well. I am using jQuery Mobile for one of my sites, so I just use a normal dialog:
Good luck.
I am a super newb at developing web pages. Especially pages that are created dynamically from javascript.
I have a page that I have worked on that uses some templates from prototype, and widgets from dojo, as well as plain old javascript. This page looks and acts perfectly in firefox.
It is basically adding rows to a table, and adding widgets to the cells.
The widgets basically seem like they are in the wrong column/wrong place.
Where do I start looking to figure out what the incompatibilities are between firefox and IE?
There are lots of sites that will give you information about compatibility. I'd check google. Also, you can download IETester which will allow you to see how your site looks in most IE versions (5.5+).
Take a look at: http://www.quirksmode.org/
I am currently trying to make a template that displays well with FF do the same in IE.
So far, I am breaking it down div by div with corresponding JS function.
Then it is easier to look up the specifics of that particular piece you are trying to make compatible.
For example, I was implementing the enter key and noticed it worked well in FF and not IE. After I looked at that specific input box in html and gathered there were no problems with it, I dove into that specific JS function. Inside I found that the currentTarget wasn't "working". I did a quick search on current target in IE and got all the info I needed to get it to work.
Get yourself a good JS debugger as well, FireBug works with both browsers.
There just aren't good web standards in the web industry right now. Everyone is doing their own thing, it is like the house and bank market. These guys are trying though.
Here's our goal: in a website, show a nice menu "à la" iPhone in Flash and when we click on a menu, show a part of the site "under" the Flash menu.
Two options:
create a page with the
Flash menu that has an iFrame and
with Flash, open the menu in that
iFrame;
create one page with a div
on its bottom, with Flash, launch a
JavaScript (if you have any better idea please tell me !) function that downloads via AJAX the desired menu.
My #1 objective is to have only one page. Ideally it would embed the Flash object and launch a JavaScript function.
PS: I hate iFrames. iFrames are evil to me.
Don't hesitate to correct my question to make it proper English !
Thanks,
Olivier
Yes, this is very possible using ExternalInterface in the Flash document. That link explains the whole process.
A bigger question is that it sounds like you are using Flash to duplicate an iPhone animation and I imagine (unless you are doing the "Flip" animation) that it could easily be reproduced with normal JavaScript animation, possibly with a library like jQuery or MooTools to help normalize browser differences. You can even do the 3D animations in Safari 4.
An older method that is sometimes still useful is the getURL method. A good writeup of the differences is here: http://www.psyked.co.uk/actionscript/actionscript-geturl-vs-externalinterface-when-why.htm. In general, ExternalInterface is preferred, but sometimes you want to interact with the page with a function that not defined.
Usage:
getURL("javascript:myFunction(arguments);");
As Doug said, you may be able to use a JS library to recreate the iPhone animations. This would have the added benefit of your menu being navigable for search engines if this is a concern.
An alternative to Doug's suggestion is the old 'fscommand()' function. In your Flash code, you put "fscommand('name', 'value');" replacing name and value with whatever information you want to fire out to the web page.
On the web page, you need to have a JavaScript function which listens to the 'FSCommand' event of the Flash object, like this (IE sample, see docs for other browsers):
function OnFSCommand(name, value)
{
// whatever you need to do with name & value
}
var swf = document.getElementById(name-of-my-Flash-object);
swf.attachEvent("FSCommand", OnFSCommand); // IE-only - see docs for other browsers