/    Sign up×
Community /Pin to ProfileBookmark

Script Compatibility

What website do any of you recommend for learning Javascript browser compatibility? I’d like to learn more about acceptable javascript programming.

I am using the script below for changing elements content without refreshing my page. Typically it works fine on recent Mozilla and IE releases if they haven’t had too many hijacked settings. I know this isn’t really much of an excuse for a script not to execute if it is done properly so I am hoping someone here can help me make what I have more compatible with more settings and browsers.

[CODE]<script type=”text/javascript”>
//<![CDATA[
function suggest(terms){
if (window.XMLHttpRequest){
xmlhttp=new XMLHttpRequest();
}else{
xmlhttp=new ActiveXObject(“Microsoft.XMLHTTP”);
}
xmlhttp.onreadystatechange=function(){
if (xmlhttp.readyState==4 && xmlhttp.status==200){
document.getElementById(“suggest”).innerHTML=xmlhttp.responseText;
}
}
xmlhttp.open(“GET”,”/app/webroot/contacts/suggestit.php?terms=”+terms,true);
xmlhttp.send();
}
function update(id){
var url=””;
if(!id){
url=”/app/webroot/contacts/edit_contact.php?”;
}else{
url=”/app/webroot/contacts/edit_contact.php?id=”+id;
}
if (window.XMLHttpRequest){
xmlhttp=new XMLHttpRequest();
}else{
xmlhttp=new ActiveXObject(“Microsoft.XMLHTTP”);
}
xmlhttp.onreadystatechange=function(){
if (xmlhttp.readyState==4 && xmlhttp.status==200){
document.getElementById(“popUpDiv”).innerHTML=xmlhttp.responseText;
}
}
xmlhttp.open(“GET”,url,true);
xmlhttp.send();
}
function toggle(div_id) {
var el = document.getElementById(div_id);
if ( el.style.display == ‘none’ ) { el.style.display = ‘block’;}
else {el.style.display = ‘none’;}
}
function blanket_size(popUpDivVar) {
if (typeof window.innerWidth != ‘undefined’) {
viewportheight = window.innerHeight;
} else {
viewportheight = document.documentElement.clientHeight;
}
if ((viewportheight > document.body.parentNode.scrollHeight) && (viewportheight > document.body.parentNode.clientHeight)) {
blanket_height = viewportheight;
} else {
if (document.body.parentNode.clientHeight > document.body.parentNode.scrollHeight) {
blanket_height = document.body.parentNode.clientHeight;
} else {
blanket_height = document.body.parentNode.scrollHeight;
}
}
var blanket = document.getElementById(‘blanket’);
blanket.style.height = blanket_height + ‘px’;
var popUpDiv = document.getElementById(popUpDivVar);
popUpDiv_height=blanket_height/2-150;//150 is half popup’s height
popUpDiv.style.top = ‘300px’;
}
function window_pos(popUpDivVar) {
if (typeof window.innerWidth != ‘undefined’) {
viewportwidth = window.innerHeight;
} else {
viewportwidth = document.documentElement.clientHeight;
}
if ((viewportwidth > document.body.parentNode.scrollWidth) && (viewportwidth > document.body.parentNode.clientWidth)) {
window_width = viewportwidth;
} else {
if (document.body.parentNode.clientWidth > document.body.parentNode.scrollWidth) {
window_width = document.body.parentNode.clientWidth;
} else {
window_width = document.body.parentNode.scrollWidth;
}
}
var popUpDiv = document.getElementById(popUpDivVar);
window_width=window_width/2-150;//150 is half popup’s width
popUpDiv.style.left = window_width + ‘px’;
}
function popup(windowname) {
//blanket_size(windowname);
window_pos(windowname);
toggle(‘blanket’);
toggle(windowname);
}
//]]>
</script>
[/CODE]

to post a comment
JavaScript

4 Comments(s)

Copy linkTweet thisAlerts:
@Declan1991Sep 03.2010 — [url=quirksmode.org]Quirksmode[/url] undoubtedly for compatibility, HTML, CSS and JavaScript.
Copy linkTweet thisAlerts:
@tymlls05authorSep 03.2010 — Thank you for the prompt reply! The website looks extremely helpful and has a lot of information I hadn't known before.

My temporary alternative to making my script compatible across as many browsers (and versions) as possible is to just not allow a login unless they have the most recent Mozilla or Internet Explorer browser. The reason I chose to do this is because this is part of a small office system of about 30 agents so if they need help upgrading their browsers I can do that also it lets me implement and activate the new system while I work on making the script more accessible.
Copy linkTweet thisAlerts:
@Declan1991Sep 03.2010 — If it works in IE 7 or later, you'll probably hit all your agents anyway, and if not, it's not a big deal to get them to update. For limited systems, it's probably better off to do so, it'll make you much more efficient at updating, and you won't have to worry much about accessibility unless you know of specific cases.
Copy linkTweet thisAlerts:
@tymlls05authorSep 03.2010 — I don't do javascript that often but what little I do use I never have compatibility issues (maybe because my stuff is usually so basic). But the particular script above I am using ajax type queries (which I probably have no business playing with) and have seen issues in anything older than the current version of mozilla and anything less than IE8. I know nothing of compatibility so I figured that updating the few I need to update will be faster than going through all the steps of making my script compatible with the various browsers and versions. And in the meanwhile I can learn a few solutions.
×

Success!

Help @tymlls05 spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 BETA 5.18,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,

tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,
)...