|
JavaScript - One Time Behavior From Button Scripts
I am attempting to implement a Close icon which responds to mouseover, mouseup, mousedown, and mouseout. The problem is that the first DIV I display, using this code, works as intended, i.e. all the button states work. I can close and reopen the same DIV and everything is still fine. If I open a second DIV, which uses the reuse code below, the button states do not appear, although the DIV will close properly. If I step through the debugger all of the state images load properly but do not appear. Once I have tried to use the button in the second DIV, all of the DIV's fail to display the button states but close properly. Additionally all of the pages where this is used are generated using XMLHttpRequest(). The DIV's using this are generated when the site loads and then shown and hidden as needed with their contents being generated via XMLHttpRequest(). Anyone have any ideas?
The intent is to reuse the following in a number of DIV's: Code: rtn = "<div id='closepanel' class='closepanel'><img src='images/closebutup.png' name='closebut' width='20px' height='20px' border='0px' onmouseover=\"swapbuttonstate('closebut','over')\" onmouseout=\"swapbuttonstate('closebut','out')\" onmousedown=\"swapbuttonstate('closebut','down')\" onmouseup=\"closePanel('"+this.msDivid+"')\" ></div>";
On startup I preload the images using : Code: if (document.images) {
closebutup= new Image();
closebutup.src="images/closebutup.png";
closebutover= new Image();
closebutover.src="images/closebutover.png";
closebutdown=new Image();
closebutdown.src="images/closebutdown.png";
}
The swapbuttonstate function is defined as: Code: function swapbuttonstate(buttonname, state) {
switch(state) {
case "over":
if (document.images) {
butover=eval(buttonname + "over.src");
document[buttonname].src= butover;
}
break;
case "out":
case "up":
if (document.images) {
butup=eval(buttonname + "up.src");
document[buttonname].src= butup;
}
break;
case "down":
if (document.images) {
butdown=eval(buttonname + "down.src");
document[buttonname].src= butdown;
}
break;
}
}
and closePanel is defined as: Code: function closePanel(divid) {
document.getElementById(divid).style.display='none';
}
Any help would be greatly appreciated. Similar TutorialsI've seen a few people elsewhere with a similar problem, but couldn't get the solutions to work for my individual problems. I am currently trying to display a gallery of images using Lightbox, and a contact form in a different modal window using a different script. Here is the URL, so you can view the source. Clicking 'contact' opens the Contact window, which currently works, and clicking the images SHOULD open lightbox but doesn't. If I shuffle the code around, I can get Lightbox to work but the contact window then breaks. If someone could provide just the code I should replace mine with so I can just copy and paste it in, that would be great because I don't know anything about javascript and struggled to follow the instructions for this I found elsewhere. However any help is appreciated! Thanks in advance. (: (Just in case you notice - please excuse my use of tables in the coding, this is just temporary) How could a make a html button that each time your press it it does a new things?
Is possible to call cgi scripts from javascript scripts?
Hello I am new to javascript (4 months), I would like to add an hour to the current time each time a button is clicked. I have this code: ------------------------------------------------------------------ var hourstbutton=document.getElementById("button3"); hoursbutton.onclick=function() { var divlink=document.getElementById("math3"); var newtime2=new Date(); var currenthours2=newtime2.getHours()+1; var currentmins2=newtime2.getMinutes(); var currentsecns2=newtime2.getSeconds(); var ampm2= (currenthours2>=12) ? "P.M." : "A.M."; if (currenthours2>=13) { currenthours2-=12; } if(currenthours2<1){ currenthours2=12; } if(currentmins2<10){ currentmins2= "0" + currentmins2; } if(currentsecns2<10){ currentsecns2="0" + currentsecns2; } divlink.innerHTML=currenthours2+":"+currentmins2+":"+currentsecns2+ " "+ampm2; ------------------------------------------------------------------------ How do I tie the number of button clicks into the number of times this code is executed? Any help is appreciated thanks. How can I do this? I'm new to JavaScript. I tried messing with While but it just caused lag as it kept looping infinitely. The problem I think is that I have a variable that changes every time I click the button. The function changes the variable. So it successfully changes the variable once to my likings, then when I click the button (thus running the function) it does nothing. Here's an example I created to show you Quote: <html> <head> <script type="text/javascript"> var x = 50; var y = Math.floor(Math.random()*5); function test() { var a = x+y document.getElementById("testing").innerHTML=a; } </head> <body> <p id="testing"></p> <input type="button" value="asdf" onclick="test()" /> </body> </html> So in this case, I need to click the button multiple times in which each time it should add y to x. It only works once and then goes kaput. Thanks! how can i make a button disable when the page is loaded first time and then make it enable on the click of other button in javascript.
Hey, I've got the following problem: I want to edit this code: <a name="fb_share" type="button_count" href="http://www.facebook.com/sharer.pp"><img src="http://blog.bastian.info/wp-content/uploads/2010/02/facebook-glossy-logo.jpg"></a><script src="http://static.ak.fbcdn.net/connect.php/js/FB.Share" type="text/javascript"></script> So that after they click the button that triggers the facebook share, 7 seconds after they click it, some text appear and the picture they click disappears. Cheers Hello im using dhtmlx grid in this cells i have from time and to time (i.e ind==1 and ind==2) i need to validate time where to-time must be greater than from-time else it should alert an message,i have writeen a normal Regular expression for the time validation.as the time is i string format i.e[05:00],please can any one send me code for that. Code: var err_str="";
function validate_grid(value,id,ind)
{
if(ind==1 || ind==2)
{
var patt=/^([0][0-9]|[1][0-9]|[2][0-3])[:]{1}[0-5][0-9]$/;
if(!patt.test(value))
{
mygrid.setCellTextStyle(id,ind,"background-color:yellow;");
if(err_str!="")
err_str+="\n"+(ind+1)+".Enter numbers and : only..";
else
err_str=(ind+1)+".Enter numbers and : only";
return false;
}
else
{
mygrid.setCellTextStyle(id,ind,"background-color:white;");
return true;
}
}
}
Hi Code: var err_str="";
function validate_grid(value,id,ind)
{
$("#result").html(" ").show();
if(ind==1 || ind==2)
{
var patt=/^([0][0-9]|[1][0-9]|[2][0-3])[:]{1}[0-5][0-9]$/;
if(!patt.test(value))
{
mygrid.setCellTextStyle(id,ind,"background-color:yellow;");
if(err_str!="")
err_str+="\n"+(ind+1)+".Enter numbers and : only..";
else
err_str=(ind+1)+".Enter numbers and : only";
return false;
}
else
{
mygrid.setCellTextStyle(id,ind,"background-color:white;");
return true;
}
}
}
alert(err-str);
here ind==1 is from_time and ind==2 is to_time,i need to validate time as to_time must be always greater than from-time,if condition fails an alert msg should populate.time format is[05:00]as it is in string format im unable to do the validation for it.(ex:from-time=08:00 to-time=07:59 condition fails) thank you. hi im using dhtml xgrid where i need to do validation for time ,(from-time and to-time i.e ind==1 and ind==2 ) to-time must be greater than from-time else i need to alert a message to-time must be greater than from-time. can any one send me the code for it time format is[05:00]. Code: var err_str="";
function validate_grid(value,id,ind)
{
$("#result").html(" ").show();
if(ind==1 || ind==2)
{
var patt=/^([0][0-9]|[1][0-9]|[2][0-3])[:]{1}[0-5][0-9]$/;
if(!patt.test(value))
{
mygrid.setCellTextStyle(id,ind,"background-color:yellow;");
if(err_str!="")
err_str+="\n"+(ind+1)+".Enter numbers and : only..";
else
err_str=(ind+1)+".Enter numbers and : only";
return false;
}
else
{
mygrid.setCellTextStyle(id,ind,"background-color:white;");
return true;
}
}
}
Hi, I am trying to figure out how the get the featured area at http://blueoceanportfolios.com to link to webpages rather than displaying it within the featured box on the left . This area is using JS file to display the videos on content in the featured box when different items on the menu are clicked, here is the working example : http://www.blueoceanportfolios.com/company/ Okay , The problem: Loading a new webpage rather than displaying the content at featured box at http://blueoceanportfolios.com Tried solutions: linking to javascript functions like onclick="window.location="http://someplace.com";" etc but still the content loads up in the featured box , try clicking on 2) it displays http://www.codingforums.com rather than loading new page. Any suggestions Hi everyone Im new here nice forum Hope someone can help out with my problem http://www.testingremote.ucoz.com/ When you click on anything other than home on the nav bar it messes up the appear/fade behavior that I added with dreamweaver any solutions ? Please help ! I have been testing regex test string to match the following pattern (- <any number with/without . decimal point>) ( -[#[.#]] ) here is the code that works the best: Code: var testStr = '99999+((-25.533) - 5)/99*(-25.533)';
var negValTestStr = new RegExp('\\(\-{1}[0-9]*\.?[0-9]*\\)', 'g');
var test = testStr.match(negValTestStr)
alert(test);
The question is: Why does it only work when the open and close parenthesis are double escaped: '\\(' and '\\)' When I use one backslash to escape, it will find -25.533, -5 and -25.533 With two backslashes for escape sequence: (-25.533), (-25.533) Also, I have to escape the - to get just one -. If I do not escape the -, -?; which should read - {0, 1} will match --# without escaping - Thanks for thoughts on this JK 1 down vote favorite I do have the countdown script (see link below) to display the time between current time and the date given in real-time. However, I want to achieve to display the time difference between a given start and end time. Right now, it calculates from the current server time to the end time. I want to be able to set up my own start time and end time. Here is what I have: http://jsfiddle.net/BgEtE/ thank you for help I have an interval set that runs indefinitely (backgrounds switching) or until the viewer stops it. I've noticed that when I close a tab while it's running and revisit the page, it "doubles" the interval and the backgrounds get mixed up. Refreshing the page returns it to normal. Does anyone know how to fix this? I've tried clearing the interval with window.onunload and window.onbeforeunload. I'm thinking it has something to do with firefox not clearing its cache for the tab. I'll look into disabling that. Ok, so I wanted to use the following object to copy the contents of the Report array at index [file][entry]. Code: Selected = {
fileIndex : file,
entryIndex : entry,
Entry : Report[file][entry]
}
This was done so that the user may perform modifications to the entry without updating the entry until I have run validation on the input. Then I used Code: if(valid) Report[Selected.fileIndex][Selected.entryIndex] = Selected.Entry to finish up. I noticed that the Report array was getting the new input even when I didn't validate. I used the following to view all the contents of the Report Array in real time Code: window.setInterval('SHOW_ARRAY();',200);
Report=[];
function SHOW_ARRAY(){
HTML('ReportDebug','') //Reset "ReportDebug" HTML element
for(var t in Report){
for(var y in Report[t]){
for(var u in Report[t][y]){
HTML('ReportDebug','<span style="position:relative ; border:2px solid black">'+Report[t][y][u]+'</span>',1) // last argument signifies to append HTML element
}
}
HTML('ReportDebug','<br />',1)
}
}
And what I discovered was that whenever I stored values in Selected.Entry the Report array would update with those values! This is my first attempt to create an object in this fashion, so my only guess is that Selected.Entry is not independent from Report[file][entry], but instead some kind of pointer... Where have I gone wrong, and how can I accomplish my goal? Let me know if my code samples were too brief. Since it is not clear to me where this post should fit in the forum, I'm just posting it here. Is it possible to create a tracking code that would allow me to: (1) a) Find out the identity of visitors to a certain website (a website unrelated to me and the visitors did not visit my website) b) The identity of those who recently searched for a certain keywords and/or... (2) Find out what websites certain individuals have recently visited (or visiting in real-time)? Sorry if this is the wrong forum for this question. I get confused about what forum to post a question in with regards to DHTML technologies since they are all frequently used together. Anyhoo, heres my question. I've recently discovered an interesting behavior. When I mouse over a nested element it triggers the 'onmouseout' event handler of the parent element. Take the following code snippet, for instance: Code: <table>
<tr>
<td onmouseout="window.alert('you moused out of td');">
<img src="image0.gif" style="height:50px; width:50px;" />
</td>
</tr>
</table>
In the code snippet above, the 'onmouseout' event handler executes when you mouse over the image nested inside the <td> element. I wouldn't have thought this would be the appropriate behavior since from my perspective the mouse is still inside the <td> element. Can someone make comments on this. Thank You. Edit: I've discovered that mousing over a nested element causes both an 'onmouseout' and an 'onmouseover' event for the parent element. They are called back to back. Seems a little bit of an odd sequence of events but maybe it makes sense in the grand scheme of things. Yeah, right. hi i am using an image scroller and i have it on three pages, the pages use the same header, the same css and the same basic structure. such as table content footer the problem is that the scroller works fine on two of the pages but does not work at all on the one page. here is what i am getting on that page Code: Message: 'ElementExtensions' is null or not an object Line: 1898 Char: 3 Code: 0 URI: http://www.mysite.com/lightbox_slideshow/prototype.js Message: Object doesn't support this property or method Line: 705 Char: 41 Code: 0 URI: http://www.mysite.com/lightbox_slideshow/lightbox.js Message: Array length must be assigned a finite positive number Line: 464 Char: 5 Code: 0 URI: http://www.mysite.com/lightbox/js/prototype.js the only common denominator i can see is that the page it does NOT work on is in fact a photo manager page, the other two (that DO work dont deal with photos) i checked the array and the js vars and stuff are different from my photo manager vars (php) so i was thinking maybe there might be a clash of some kind accessing the queries at the same time when the page loads but i dont get any errors other than these. by the way the scroller is black not grey like the others for background. does it sound like from the errors that i am getting that it might be a db query clash of somekind or do you know anything about those errors above that might give me a clue whats going on. thanks The code below is supposed to cancel the default form behavior when it finds certain info missing. Currently, however, in spite of detecting missing info it allows the form submission to continue. Anyone see what wrong? Thanks. Code: var DOM = YAHOO.util.Dom;
YAHOO.util.Event.onDOMReady(init);
function init() {
YAHOO.util.Event.addListener("contact_form", "submit", checkForm);
}
function checkForm() {
var fName = DOM.get('f_name');
var lName = DOM.get('l_name');
if (fName.value == "") {
DOM.get('f_name_error').innerHTML = "This field is required!";
fName.focus();
return false;
}
|
|||||||