|
JavaScript - Mouse Dragging Script Not Working With Ff And Chrome
Hi,
I was wondering if anyone could help me out with a script I'm trying to create/customize. The idea is to scroll an image by dragging of the mouse (like you have with Google maps for example), instead of the scrollbars. Right now I'm using a script that does the job perfectly fine under IE, but not so much under FireFox, and definitely not under Chrome. Some additional code is probably needed but I have no clue how to write proper JavaScript. Everything I try gives errors and leaves me baffled. Here's a hands-on example of what I mean (works only under IE!): http://home.wanadoo.nl/r.a.dekk/kaart/kaart.html This is the script I'm using now: Quote: <!-- <script type="text/javascript"> document.onmousedown = function(){ var e=arguments[0]||event; var x=document.body.scrollLeft+e.clientX; var y=document.body.scrollTop+e.clientY; document.onmousemove=function(){ scroll(x-e.clientX, y-e.clientY); return false; } document.onmouseup=function(){ document.onmousemove=null; } return false; } </script> //--> Any help will be appreciated. Thanks. Similar TutorialsSince the upgrade from chrome 9 to chrome 10 my script is showing an error in my variables when i use boolean expressions. they changed to version V8, Chrome's JavaScript engine. Here is the function function get_form_value(n){ e=document.getElementById(n); if ((e.value)&&(e.value != "")&&(!e.options)) return e.value; if ((e.selectedIndex)&&(e.selectedIndex>0) &&(e.options[e.selectedIndex].value !="")) return e.options[e.selectedIndex].value; // select if ((e.text)&&(e.text.value !="")) continue; if ((e.selectedIndex)&&(e.selectedIndex>0) &&(e.options[e.selectedIndex].text !="")) return e.options[e.selectedIndex].text; // select if ((e.checkbox)&&(e.checkbox.checked)) return true; return false; } When i run it it shows a syntax error: Can someone please help me fix this? Hi there, I am looking for a javascript code for an html file. I am looking for something where when you put your mouse over the text, a drop down list will come down. If anyone can point me in the right direction that would be helpful. An example would be on a site like www.espn.com - when you put your mouse over NBA the following options appear: NBA Home, Scores, Schedule, Teams, etc. it works great in chrome and strangely enough internet explorer 8 but doesn't work in firefox Code: // Detect if the browser is IE or not.
// If it is not IE, we assume that the browser is NS.
var IE = document.all?true:false;
// If NS -- that is, !IE -- then set up for mouse capture
if (!IE) document.captureEvents(Event.MOUSEMOVE)
// Set-up to use getMouseXY function onMouseMove
document.onmousemove = DRAG;
// Temporary variables to hold mouse x-y pos.s
// Main function to retrieve mouse x-y pos.s
var tempX = 0;
var tempY = 0;
function DRAG(e)
{
if (!IE)
{ // grab the x-y pos.s if browser is NS
tempX = e.pageX;
tempY = e.pageY;
}
else
{ // grab the x-y pos.s if browser is IE
tempX = event.clientX + document.body.scrollLeft
tempY = event.clientY + document.body.scrollTop
}
// catch possible negative values in NS4
if (tempX < 0){ tempX = 0; }
if (tempY < 0){ tempY = 0; }
// show the position values in the form named Show
// in the text fields named MouseX and MouseY
var w = getW();
var h = getH();
if(tempX > (w-32)){tempX = w-32;}
if(tempY > (h - 32)){tempY = h-32; }
var newX = tempX-id.offsetWidth;
var newY = tempY-header.offsetHeight-id.offsetHeight;
if(newX < 0){newX = 0; }
if(newY < 0){newY = 0; }
document.getElementById('myx').innerHTML = newX;
document.getElementById('myy').innerHTML = newY;
id.style.left = newX+"px";
id.style.top = newY+"px";
I'm trying to enable/disable a textarea. I am able to do a mouseout disable, but cannot do a mouseover enable. For instance, when I click on the image, a textarea shows up. When I move my mouse to a different location, the textarea disables fine. Then when I try to move my mouse back over the textarea, it DOES NOT enable for me to write in it. What am I doing wrong? Thanks! Another bonus question, I just happen to try out this code in IE and the textareas are not showing up where I click. I assume that I'm capturing the X/Y coordinates incorrectly for an IE browser. Any pointers? ********* CODE ************* <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <title>Mouse position</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <script type="text/javascript"> var posx, posy; // initialize cache var cache= []; var count=0; function getMouse(e){ posx= posy= 0; var ev= (!e) ? window.event : e;//IE:Moz if (ev.pageX){//Moz posx=ev.pageX+window.pageXOffset; posy=ev.pageY+window.pageYOffset; } else if(ev.clientX) {//IE posx=ev.clientX+document.body.scrollLeft; posy=ev.clientY+document.body.scrollTop; } else { // old browsers return false; } } function showP(){ // object to store this coordinate var thisCoord= {}; // x & y values stored as object attributes thisCoord.posx= posx; thisCoord.posy= posy; // check the cache for this coordinate object if ( !cache[thisCoord] ) { // if it hasn't been cached yet, push it onto the stack cache.push(thisCoord); var newDiv= document.createElement("textarea"); newDiv.setAttribute("class","div3"); newDiv.setAttribute("id",count); newDiv.style.width='180px'; newDiv.style.height='45px'; newDiv.style.visibility="visible"; newDiv.style.top= (thisCoord.posy -10) +'px'; newDiv.style.left= (thisCoord.posx -6) +'px'; newDiv.setAttribute("onmouseout","this.disabled=true"); newDiv.setAttribute("onmouseover","this.disabled=false"); // append to the document BODY document.getElementsByTagName("body")[0].appendChild(newDiv); count++; } } </script> <style type="text/css"> .div1 {position:absolute;top:100px;left:100px;visibility:visible;z-index:5} .div2 {position:absolute;top:0px;left:0px;visibility:hidden;z-index:1;color:black;} .div3 {position:absolute;visibility:hidden;z-index:10;font-size:14px;font-weight:450;color:black;} textarea[disabled='disabled'] { background:yellow; color:blue; cursor:default; } </style> </head> <body> <div id="div1" class="div1"> <img id="theImage" src="./YourImage.jpg"> </div> <script type="text/javascript"> // setup event handlers // document BODY onmousemove document.getElementsByTagName("body")[0].onmousemove= function(e){ getMouse(e); }; // the image onclick document.getElementById("theImage").onclick= showP; //onMouseOut </script> </body> </html> Hi, I was trying to code a draggable div, but ran into a weird behavior until I added "return false;" or rather "preventDefault();" to my onmousedown function. Now, I wonder why I need to prevent the default action for onmousedown triggered on a div. I understand what it usually does (e.g. preventing a form from submitting, etc.) But what default action is actually being prevented in this case? Thanks for your help. Here's the script: Code: <script type="text/javascript">
var dragging = false;
var draggable;
window.onload = function() {
draggable = document.getElementById('draggable');
draggable.onmousedown = function(e) {
dragging = true;
if (e.preventDefault) e.preventDefault(); else e.returnValue = false;
}
}
window.onmousemove = function(e) {
if (!e) e = window.event;
if (dragging) {
draggable.style.left = e.clientX - 30 + 'px';
draggable.style.top = e.clientY - 30 + 'px';
}
}
window.onmouseup = function() {
dragging = false;
}
</script>
And the HTML code: Code: <div id="draggable"></div> Script runs fine in latest stable release of Firefox 3 but breaks in chrome Code: function fixCSS(){
var styles={
'Yotsuba':'http://static.4chan.org/css/yotsuba.9.css',
'Yotsuba B':'http://static.4chan.org/css/yotsublue.9.css',
'Futaba':'http://static.4chan.org/css/futaba.9.css',
'Burichan':'http://static.4chan.org/css/burichan.9.css'
}
for(i in document.getElementsByTagName('link')){
for(j in styles){
if(document.getElementsByTagName('link')[i].title==j)document.getElementsByTagName('link')[i].href=styles[j];
}
}
// if all else fails just delete every link tag and replace with the default linkset
// this may be commented out later on
if(document.defaultView.getComputedStyle(document.body,'').getPropertyValue('background-color')!='rgb(255, 255, 238)'){
for(i=0;i<document.getElementsByTagName('link').length;i++){
document.getElementsByTagName('link')[0].parentNode.removeChild(document.getElementsByTagName('link')[0]);
}
var linkHTML='<link rel="shortcut icon" href="http://static.4chan.org/image/favicon.ico"/><link rel="shortcut icon" href="http://static.4chan.org/image/favicon.ico" /><link rel="stylesheet" type="text/css" href="http://static.4chan.org/css/yotsuba.9.css" title="Yotsuba"><link rel="alternate stylesheet" type="text/css" href="http://static.4chan.org/css/yotsublue.9.css" title="Yotsuba B"><link rel="alternate stylesheet" type="text/css" href="http://static.4chan.org/css/futaba.9.css" title="Futaba"><link rel="alternate stylesheet" type="text/css" href="http://static.4chan.org/css/burichan.9.css" title="Burichan">';
document.getElementsByTagName('head').innerHTML=document.getElementsByTagName('head').innerHTML+linkHTML;
}
var changer='<tr><td>Style [<a href="#" onclick="setActiveStyleSheet(\'Yotsuba\'); return false;">Yotsuba</a> | <a href="#" onclick="setActiveStyleSheet(\'Yotsuba B\'); return false;">Yotsuba B</a> | <a href="#" onclick="setActiveStyleSheet(\'Futaba\'); return false;">Futaba</a> | <a href="#" onclick="setActiveStyleSheet(\'Burichan\'); return false;">Burichan</a>]</td></tr>';
if(document.getElementsByClassName('deletebuttons')[0].parentNode.parentNode.innerHTML.indexOf('setActiveStyleSheet')==-1)document.getElementsByClassName('deletebuttons')[0].parentNode.parentNode.innerHTML+=changer;
}
function killCotten(){
for(i in document.getElementsByTagName('embed')){
document.getElementsByTagName('embed')[i].parentNode.removeChild(document.getElementsByTagName('embed')[i]);
}
}
killCotten();
fixCSS();
Error message reported by Chrome's "JavaScript Console": Uncaught TypeError: Cannot call method 'removeChild' of undefined killCotten Screenshot of debugger: This little snippet of code (in full) refuses to lnk properly in FF and Chrome, but IE downloads the file. Code: <tr>
<td nowrap>
<span style="font-weight: 700; font-size: 11px; background-color: #FFFF00" onclick="location.href ('http://aapress.com.au/print/headerfooteron.reg')" class="hand" onmouseover="this.style.textDecoration='underline'" onmouseout="this.style.textDecoration='none'" style="font-size: 11px; font-weight: 700; background-color:#FFFF00;">
CLICK HERE</span><font size="2"> to turn </font>
<span class="hand">
<span style="font-weight: 700; font-size: 11px; background-color: #FFFF00">
ON</span></span></td>
<td nowrap width="100"> </td>
</tr>
Is there something wrong with using location.href? Hi guys, I have the following code that should hide the dropdown part of a select box when clicked (don't ask why, this is part of a separate project). Please see a simple example below: Code: <script language="javascript" type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.js"></script>
<select name="select1" id="select1" onfocus="$(this).blur();">
<option value=""></option>
<option value="">1</option>
<option value="">2</option>
<option value="">3</option>
<option value="">4</option>
</select>
This all works fine in IE and FF but in chrome the options are still shown after clicking the element. I've been racking my brains for hours on this and, no matter what method I use, I can't get this to work correctly in Chrome. Can anyone suggest a way I can get this to work? Thanks in advance! Hello all I have this code to write the year which works fine in ie ff but apparantly is not working in google chrome. I don't have chrome and so can't check can anybody tell me why chrome has an issue with it? What should I change to make it chrome compliant:-) In ie ff it displays 2012 correctly but in chrome i'm told it is showing 112 ro something like that. Code: Code: any help very much appreciated LT Hi everyone, I'm putting together a family tree type organization chart and looking to be able to drag it around to view different parts similar to google maps. I believe javascript is the way to handle this but need some help pointing me in the right direction. Any help would be greatly appreciated. Thanks, Mike Hello all, I'm back with more silly newbie questions. I'm building a website that includes 3 javascript codes: 1. Onmouseover image switch for the nav bar. 2. On a specific page, onmouseover display of hidden divs. 3. Particletree's Dynamic Resolution Dependent Layout script (http://particletree.com/features/dyn...ndent-layouts/) All three scripts work fine in firefox, but the 2nd script doesn't work in safari and chrome, and the 3rd one doesn't work in safari, chrome and IE(8). Since the 1st one works fine in all browsers, I'm guessing this isn't a problem with my javascript link or anything like that. The website is: www.sheket.co.il/index4.html The specific page that runs the 2nd code is: www.sheket.co.il/services.html My javascript is: http://www.sheket.co.il/javascript.js And my default stylesheet is: http://www.sheket.co.il/style.css (I apologize for possible jibrish- the website is in Hebrew...) Any help with these two problems would be greatly appreciated! Hi, I have a small script that tries to open a child window. if successful, it then closes the child window and redirects the parent window. If this process fails, there is no child window, no redirection. the script below works fine in FireFox but in Chrome, if the process fails, the redirection still happens. I'm new to JS would appreciate your help many thanks Code: <script type="text/javascript">
function openwindow(){
testWindow = window.open("popup.php","interaction");
setTimeout(function() { testWindow.close(); },1000);
setTimeout(function() { window.location = "http://www.google.com"; },1000);
}
</script>
I am ripping my hair out trying to figure out why my innerHTML code is not working. It only works in IE, but keeps failing in Chrome and Firefox. I am using a form text field for customers to enter a Gallery ID (text value in the form field) which I have set up for them in an external js file. I use this code to change the content of div's after it checks the js file for a matching text value. Here is what is happening-- the proper content shows up for a second in Chrome or Firefox if the username value matches, but it pops away really fast and goes back to the login field prompt. Javascript: Code: <head>
<script type="text/javascript">
function setinitialvalues(){
document.getElementById('loginblock').style.visibility = 'visible';
document.getElementById('galleryinfo2').style.visibility = 'hidden';
document.getElementById('expiredmessage').style.visibility = 'hidden';
document.getElementById('republish').style.visibility = 'hidden';
document.getElementById('logoutmessage').innerHTML = "";
document.getElementById('logoutmessage2').innerHTML = "";
document.getElementById('logoutmessage').style.visibility = 'hidden';
document.getElementById('logoutmessage2').style.visibility = 'hidden';
}
</script>
<script type="text/javascript">
function loadcustomer(){
document.getElementById('galleryinfo').innerHTML = "";
document.getElementById('galleryinfo2').innerHTML = "";
document.getElementById('expdatemessage').innerHTML = "";
document.getElementById('expiredmessage').innerHTML = "";
document.getElementById('republish').innerHTML = "";
document.getElementById('logoutmessage').style.visibility = 'hidden';
document.getElementById('logoutmessage2').style.visibility = 'hidden';
document.getElementById('loginblock').innerHTML = "<br /><h4>If you know your Gallery ID, you can enter it here to access your proofing gallery and order page.<br /><br />ENTER GALLERY ID:</h4><form name='form' action='' method='post'><input style='color:#000;' name='username' id='username' onfocus='clearinvalid()' onKeyDown='clearinvalid()'><br /><br /><input style='background-color:#33A1C9;' class='button' id='submitbutton' type='submit' value='Submit' onClick='return galleryid(this.form)'></form><h4><div style='color:#ff0000;' id='invalidmessage'></div></h4><br />Sample Gallery ID: demo<br />(Then click the Submit button. Some browsers do not accept the Enter key.)<br /><br /><a href='#' class='btn btn-lg btn-default'>Back to Menu</a><br /><br />This works on Internet Explorer, Firefox, Opera and Google Chrome. Please use one of these web browsers to log in.";
document.getElementById('loginblock').style.visibility = 'visible';
}
</script>
<script language="javascript" type="text/javascript" src="customergallery.js"></script>
</head>
HTML: Code: <div style="text-align:center;" id="loginblock"></div> <div id="galleryinfo"></div> <div id="galleryinfo2"></div> <div style="color:#ff0000;" id="expdatemessage"></div> <div style="color:#ff0000;" id="expiredmessage"></div> <div id="republish"></div> <div id="logoutmessage"></div> <div id="logoutmessage2"></div> External customer js file: Code: function Submit(){
if(event.keyCode == 13)
{
galleryid();
return false;
}
}
function galleryid(){
if (document.getElementById('username').value == 'demo') {
var name = "My Photomatic Photo Session";
var sessiondate = "02/22/2014";
var location = "Any town, USA";
var orderlink = "<a href='../../accounts/brown/20140222/myphotomatic20140222.html' target='_blank'>CLICK HERE TO VIEW GALLERY</a>";
var todayDate = new Date();
var expdate = new Date(2015,05,30);
comparedate();
}
else if (document.getElementById('username').value == '') {
document.getElementById('invalidmessage').innerHTML = 'Please enter a value in this field.';
}
else {
document.getElementById('invalidmessage').innerHTML = 'Invalid Gallery ID. Please try again.';
}
document.getElementById('username').value = "";
return false;
function comparedate() {
if (todayDate >= expdate)
{
document.getElementById('galleryinfo2').innerHTML = "<br /><br />" + name + "<br />Session Date: " + sessiondate + "<br />" + location + "<br /><br />";
document.getElementById('expiredmessage').innerHTML = "This gallery has expired on " + (expdate.getMonth()+1) + "/" + expdate.getDate() + "/" + expdate.getFullYear();
document.getElementById('republish').innerHTML = "<br />If you would like to have this gallery republished, please email me .<br /><br />";
document.getElementById('logoutmessage2').innerHTML = "<a href='javascript:void(0);' onclick='loadcustomer(); clearusername(); setinitialvalues();' class='btn btn-lg btn-default'>Click here to return to the Login</a><br /><br />";
document.getElementById('galleryinfo2').style.visibility = 'visible';
document.getElementById('expiredmessage').style.visibility = 'visible';
document.getElementById('republish').style.visibility = 'visible';
document.getElementById('logoutmessage2').style.visibility = 'visible';
document.getElementById('loginblock').innerHTML = "";
document.getElementById('loginblock').style.visibility = 'hidden';
}
else {
loadcustomer();
document.getElementById('galleryinfo').innerHTML = "<br /><br />" + name + "<br />Session Date: " + sessiondate + "<br />" + location + "<br /><br />" + orderlink + "<br /><br />";
document.getElementById('expdatemessage').innerHTML = "This gallery will expire on " + (expdate.getMonth()+1) + "/" + expdate.getDate() + "/" + expdate.getFullYear() + ".<br /><br />";
document.getElementById('logoutmessage').innerHTML = "<a href='javascript:void(0);' onclick='loadcustomer(); clearusername(); setinitialvalues();' class='btn btn-lg btn-default'>Click here to return to the Login</a><br /><br />";
document.getElementById('logoutmessage').style.visibility = 'visible';
document.getElementById('loginblock').innerHTML = "";
document.getElementById('loginblock').style.visibility = 'hidden';
}
}
}
function clearinvalid(){
document.getElementById('invalidmessage').innerHTML = '';
}
function clearusername(){
document.getElementById('username').value = "";
}
Where am I going wrong and what can I do to make this work in Chrome and Firefox? It works great in IE. Thanks! Title explains it really. The button I am using working perfecting in FireFox and Chrome but not in Internet explorer. (Yes I know someone that actually uses IE that pointed this out to me) The rest of the code works fine but just not the reset button I have. Something I have been needing to do is make the code call my images differently by putting them in an array so I don't mess this the sources of my images like I sloppily am here, but I am not sure if that will actually fix the problem I am have. The checkbox should both uncheck the box(if checked) AND change the picture but it only unchecks the box. Here is the relevant code let me know if you want me to post the whole thing. Code: function reset(){
cb1.checked=false;
document.goodAfternoon.src=goodAfternoonFinal.src;
}
Code: "Check" me out;) <input type="checkbox" id="cb1" onClick="validate()" /> <img src="Good Afternoon.gif" name="goodAfternoon"> <input type="button" id="cb2" value="RESET" onClick="reset()"/> Hello I have created awebpage here with an onmouseover slideshow, adapted from the Cut & paste Onmouseover Slideshow from Javascript kit This works in IE8 but not in Firefox or Chrome. I appreciate this may have been previously solved but I cannot find it in the threads. I have an "animated slideshow" of 29 jpeg images on a page created using Javascript. It works fine in Internet Explorer and Firefox but not Safari or Chrome. The jpeg files names are 01.jpg through to 29.jpg. Here below is the code in the header and the body. There is an error in there somewhe <html> <head> <title>My webpage</title> <META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=utf-8"> <SCRIPT language="JavaScript" type="text/JavaScript"> <!-- var speed=1333; var counter = 1; function rollPics() { document.display.src=counter+".jpg"; //Display image "counter".jpg counter ++; // Add 1 to counter if (counter>29) { // If counter is greater than 29 images then reset it counter=1 } } <!-- END --> </SCRIPT> </head> <body> <center> <table> <tr><td> <IMG NAME="display" SRC="1.jpg" onLoad="setTimeout('rollPics()',1333)"> </td></tr> </table> </center> </body> </html> Hi, I'm new to this forum so please forgive me on any errors I may have made. I am working on a simple site for the company that I work for that allows a customer to input a 5 digit code in and returns what prize they have won. I found some code on a website which done the trick but it doesn't work in Chrome and Safari. My Javascript knowledge is extremely limited but I think I've narrowed it down to the "document.implentation.createDocument" line although the few fixes I've found, I can't get to work. Here is the code I have at the moment before I applied the fixes (this works in FF and IE). Code: <script type="text/javascript">
window.onload = loadIndex;
function loadIndex() { // load indexfile
// most current browsers support document.implementation
if (document.implementation && document.implementation.createDocument) {
xmlDoc = document.implementation.createDocument("", "", null);
xmlDoc.load("results.xml");
}
// MSIE uses ActiveX
{
xmlDoc = new ActiveXObject("Microsoft.XMLDOM");
xmlDoc.async = "false";
xmlDoc.load("results.xml");
}
}
function searchIndex() { // search the index (duh!)
if (!xmlDoc) {
loadIndex();
}
// get the search term from a form field with id 'searchme'
var searchterm = document.getElementById("searchme").value;
var allitems = xmlDoc.getElementsByTagName('item');
results = new Array;
if (searchterm.length < 4) {
alert("Please re-check and enter your 5 digit code");
} else {
for (var i=0;i<allitems.length;i++) {
// see if the XML entry matches the search term,
// and (if so) store it in an array
var name = allitems[i].lastChild.nodeValue;
var exp = new RegExp(searchterm,"i");
if ( name.match(exp) != null) {
results.push(allitems[i]);
}
}
// send the results to another function that displays them to the user
showResults(results, searchterm);
}
}
// Write search results to a table
function showResults(results, searchterm) {
if (results.length > 0) {
// if there are any results, write them to a table
document.write('<head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>Untitled Document</title><link href="cno-competition.css" rel="stylesheet" type="text/css" /></head><body>');
document.write('<div id="container"><div id="logo"></div><div id="prizeContent"><img src="media/new-york.jpg" width="750" height="500" alt="New York" />');
for(var i=0; i<results.length; i++) {
document.write('<h1>Congratulations</h1><p>You entered prize code <b><i>'+searchterm+'</i></b> and have won a <span style="font-weight:bold; color:#75ACC1">' + results[i].getAttribute("prize") + '</span>.</p>');
}
document.write('<p>To claim your prize please contact the Complete Night Out team on 01908 544445.</p>');
document.write('</div></div></body></html>');
document.close();
} else {
// else tell the user no matches were found
var notfound = alert('No results found for '+searchterm+'! Please re-check and enter your 5 digit code');
}
}
</script>
The fix I found added the below into the code but I couldn't get it to work using this. Link here. Code: var xmlhttp = new window.XMLHttpRequest();
xmlhttp.open("GET","results.xml",false);
xmlhttp.send(null);
xmlDoc = xmlhttp.responseXML.documentElement;
Any help would be much appreciated. If you would like to see the site live please click here Thank you. Kishan Hello, I have used a free javascript from javascriptkit.com for a "highlighter scroller" in my site. But the programe is only working in Internet explorer. When i use Mozila or google chrome, it is not appearing/working. Can anyone suggest me that how it will work in other browser also. here is the code that i used: Code: <div style="position:relative;left:0px;top:0px"> <span id="highlighter" style="position:absolute;left:0;top:0;font-size:15px;font-family:Calibri;background-color:lime;clip:rect(0px 0px auto 0px)"></span> </div>
<script type="text/javascript">
/*
Highligher Scroller script- By JavaScript Kit
For this and over 400+ free scripts, visit http://www.javascriptkit.com/
This notice must stay intact
*/
var tickercontents=new Array()
tickercontents[0]='<a href="ln.htm">IJSG Welcomes the Kingdom of Morocco as its new Member</a>'
var tickdelay=3000 //delay btw messages
var highlightspeed=10 //10 pixels at a time.
////Do not edit pass this line////////////////
var currentmessage=0
var clipwidth=0
function changetickercontent(){
crosstick.style.clip="rect(0px 0px auto 0px)"
crosstick.innerHTML=tickercontents[currentmessage]
highlightmsg()
}
function highlightmsg(){
var msgwidth=crosstick.offsetWidth
if (clipwidth<msgwidth){
clipwidth+=highlightspeed
crosstick.style.clip="rect(0px "+clipwidth+"px auto 0px)"
beginclip=setTimeout("highlightmsg()",20)
}
else{
clipwidth=0
clearTimeout(beginclip)
if (currentmessage==tickercontents.length-1) currentmessage=0
else currentmessage++
setTimeout("changetickercontent()",tickdelay)
}
}
function start_ticking(){
crosstick=document.getElementById? document.getElementById("highlighter") : document.all.highlighter
crosstickParent=crosstick.parentNode? crosstick.parentNode : crosstick.parentElement
if (parseInt(crosstick.offsetHeight)>0)
crosstickParent.style.height=crosstick.offsetHeight+'px'
else
setTimeout("crosstickParent.style.height=crosstick.offsetHeight+'px'",100) //delay for Mozilla's sake
changetickercontent()
}
if (document.all || document.getElementById)
</script></td>
Inside body I have used <body onload="populate();start_ticking()"> for multiple script in a page. Thank you in advance. Regards, Nazmul Karim Khan Hi Guys, This is my first post, apologies in advance. I'm new to javascript and working on a form, for some reason the checkboxes work fine in Google Chrome but ar enot working corectly when using IE. Can anyone put me out of my misery? I've attached the code below Thanks in advance Code: //The Javascript
// Functional Code - NO NEED to Change
function f40_Disable(f40_par,f40_obj,f40_state){
if (f40_par){f40_clds=f40_AllElements(document.getElementById(f40_par)); }
else { f40_clds=f40_AllElements(f40_obj.parentNode); }
if (!f40_obj.ary){
f40_obj.ary=new Array();
for (f40_0=0;f40_0<f40_clds.length;f40_0++){
if (f40_clds[f40_0].tagName=='INPUT'||f40_clds[f40_0].tagName=='SELECT'||f40_clds[f40_0].tagName=='TEXTAREA'){
f40_obj.ary[f40_obj.ary.length]=f40_clds[f40_0];
}
}
}
for (f40_1=0;f40_1<f40_obj.ary.length;f40_1++){
f40_obj.ary[f40_1].removeAttribute('disabled');
}
if (f40_obj.checked==f40_state){
for (f40_2=0;f40_2<f40_obj.ary.length;f40_2++){
f40_obj.ary[f40_2].setAttribute('disabled','disabled');
}
}
f40_obj.removeAttribute('disabled');
}
function f40_AllElements(f40_){
if (f40_.all){ return f40_.all; }
return f40_.getElementsByTagName('*');
}
Code: <p><LABEL ACCESSKEY=''><input type='checkbox' name='apps' id='apps[0]' value='BW' onclick="f40_Disable(null,this,false);">BW <input type="text" size="15" maxlength="30" disabled="disabled" name="ShipFirst"> <p><LABEL ACCESSKEY=''><input type='checkbox' name='apps' id='apps[1]' value='Advantage' onclick="f40_Disable(null,this,false);">Advantage <input type="text" size="15" maxlength="30" disabled="disabled" name="ShipLast"> <p><LABEL ACCESSKEY=''><input type='checkbox' name='apps' id='apps[2]' value='MS' onclick="f40_Disable(null,this,false);">MS <input type="text" size="15" disabled="disabled" name="ShipEmail"> <p><LABEL ACCESSKEY=''><input type='checkbox' name='apps' id='apps[3]' value='MOC' onclick="f40_Disable(null,this,false);">MOC <input type="text" size="15" maxlength="30" disabled="disabled" name="ShipCompany"> <p><LABEL ACCESSKEY=''><input type='checkbox' name='apps' id='apps[4]' value='Lk' onclick="f40_Disable(null,this,false);">Lk <input type="text" size="15" maxlength="30" disabled="disabled" name="ShipAddress1"> <p><LABEL ACCESSKEY=''><input type='checkbox' name='apps' id='apps[5]' value='CM' onclick="f40_Disable(null,this,false);">CM <input type="text" size="15" maxlength="30" disabled="disabled" name="ShipAddress2"> <p><LABEL ACCESSKEY=''><input type='checkbox' name='apps' id='apps[6]' value='Ga' onclick="f40_Disable(null,this,false);">Ga <input type="text" size="15" maxlength="30" disabled="disabled" name="ShipCity"> <p><LABEL ACCESSKEY=''><input type='checkbox' name='apps' id='apps[7]' value='Ol' onclick="f40_Disable(null,this,false);">Ol <input type="text" size="15" maxlength="30" disabled="disabled" name="ShipZip"> <p><LABEL ACCESSKEY=''><input type='checkbox' name='apps' id='apps[8]' value='Iy' onclick="f40_Disable(null,this,false);">Iy <input type="text" size="15" maxlength="30" disabled="disabled" name="ShipZip1"> <p><LABEL ACCESSKEY=''><input type='checkbox' name='apps' id='apps[9]' value='TPA' onclick="f40_Disable(null,this,false);">TA <input type="text" size="15" maxlength="30" disabled="disabled" name="ShipZip2"> <p><LABEL ACCESSKEY=''><input type='checkbox' name='apps' id='apps[10]' value='CT' onclick="f40_Disable(null,this,false);">CT <input type="text" size="15" maxlength="30" disabled="disabled" name="ShipZip3"> I havent included the whole script as it's quite long, I'm assuming the problem is somewhere within this section. Thanks. Hello, I am attempting to implement a javascript joystick plugin. The project has a google code page located at: http://code.google.com/p/javascript-joystick/ After installing the plugin, the javascript works flawlessly in IE and FF, however chrome has some issues with executing it. A hosted version of what I am having trouble with can be found at http://www.jimmyblaze.net/joytest/simple.html The issue seems to be with a snippet of code from the main script that attempts to create an object and embed it on the page. The trouble area can be found he Code: try {
ctrlFF.type = "application/x-vnd.numfum-joystick";
ctrlFF.width = 0;
ctrlFF.height = 0;
/*
* Before accessing the plug-in's script interface it needs to be
* added to the page. If the 'setDevice' call fails, the plug-in
* is assumed to either not be installed or not working in this
* browser, in which case it is removed in the catch.
*/
document.body.appendChild(ctrlFF, document.body);
if (ctrlFF.setDevice(0) != null) {
/*
* As with the code for IE, any non-null value is a
* success.
*/
return ctrlFF;
}
Chrome doesn't seem to support the .setDevice function, as when running the chrome developer tools inspect element tool, I can see it throw an exception at that line, and prompts the user to update java, because it thinks it is out of date. Has anyone run into this issue with chrome and know of a possible fix? Thanks a lot for your time, Legomaniac |
|||||||