|
JavaScript - How To Stop A Javascript
Hi Guys,
Quick question, is there a way to stop a JavaScript from validating after a certain point of the code. I've been "googling" like crazy and cant find a solution. I had to add a Checkbox validation last second and there was existing validation and I'm not good enough to alter all of it to reflect the checkbox part so what I did was I checked to see if at least one of the checkboxes was selected, if yes, do nothing and finish the rest of the validation. If no, prompt them with an error. The problem is after it prompts them for an error, it continues to run the rest of the validation and at the end it allows the end user to print. I cannot allow the end user to print until everything is filled in. Here is my code: Code: function validateFields() {
var fieldsToVerify = [
["PrincipalInvestigator"],
["ContactEmailAddress"],
["RFAward"],
["Sponsor"],
["AwardTitle"],
["BudgetStartDate"],
["BudgetEndDate"],
["SectionII"],
["ProjectRole"],
["EmployeeName"],
["DatesofAppointment"],
["EffortonProject"],
["Date"],
["PrintName"],
["Date2"],
["PrintName2"],
];
var emptyFields = [];
var notFullFields = [];
for (var i=0; i<fieldsToVerify.length; i++) {
var f = this.getField(fieldsToVerify[i][0]);
if (f==null) {
console.println(fieldsToVerify[i][0] + " not found.");
continue;
}
if (f.valueAsString=="") {
emptyFields.push(f.name);
} else if (fieldsToVerify[i].length>1 && f.valueAsString.length<fieldsToVerify[i][1]) {
notFullFields.push([f.name,fieldsToVerify[i][1]]);
}
}
for (var i in nonRequiredFieldsToVerify) {
var f = this.getField(nonRequiredFieldsToVerify[i]);
if (f==null) {
console.println(nonRequiredFieldsToVerify[i] + " not found.");
continue;
}
if (f.valueAsString!="" && f.valueAsString.length<f.charLimit) {
notFullFields.push([f.name,f.charLimit]);
}
}
if
(this.getField("CheckBox1").value=="Yes" || this.getField("CheckBox2").value=="Yes" || this.getField("CheckBox3").value=="Yes" || this.getField("CheckBox4").value=="Yes" || this.getField("CheckBox5").value=="Yes" || this.getField("CheckBox6").value=="Yes" || this.getField("CheckBox7").value=="Yes")
{}
else
app.alert("Select a Checkbox in Section I before printing")
if (emptyFields.length==0 && notFullFields.length==0) {
this.print();
} else {
var msg = "";
if (emptyFields.length>0) {
msg += "The following fields must be filled-in:\n";
for (var i in emptyFields)
msg += emptyFields[i]+"\n";
}
if (notFullFields.length>0) {
if (msg!="") msg+="\n\n";
msg += "The following fields are not filled-in completely:\n";
for (var i in notFullFields)
msg += notFullFields[i][0] + " (required length: " + notFullFields[i][1] + ")\n";
}
app.alert(msg,"");
}
}
Similar TutorialsI am very new to Javascript - as in this is the first day I'm using it. I am using a code I got offline to fade three pictures together, but when it gets to the last image, it loops back to the first. How do I code it so that when it gets to the last image, it stops? Here is the code - sorry if its messy. Javascript: /***** Image Cross Fade Redux Version 1.0 Last revision: 02.15.2006 steve@slayeroffice.com Please leave this notice intact. Rewrite of old code found he http://slayeroffice.com/code/imageCrossFade/index.html *****/ window.addEventListener?window.addEventListener("load",so_init,false):window.attachEvent("onload",so _init); var d=document, imgs = new Array(), zInterval = null, current=0, pause=false; function so_init() { if(!d.getElementById || !d.createElement)return; // DON'T FORGET TO GRAB THIS FILE AND PLACE IT ON YOUR SERVER IN THE SAME DIRECTORY AS THE JAVASCRIPT! // http://slayeroffice.com/code/imageCrossFade/xfade2.css css = d.createElement("link"); css.setAttribute("href","xfade2.css"); css.setAttribute("rel","stylesheet"); css.setAttribute("type","text/css"); d.getElementsByTagName("head")[0].appendChild(css); imgs = d.getElementById("imageContainer").getElementsByTagName("img"); for(i=1;i<imgs.length;i++) imgs[i].xOpacity = 0; imgs[0].style.display = "block"; imgs[0].xOpacity = .99; setTimeout(so_xfade,3000); } function so_xfade() { cOpacity = imgs[current].xOpacity; nIndex = imgs[current+1]?current+1:0; nOpacity = imgs[nIndex].xOpacity; cOpacity-=.05; nOpacity+=.05; imgs[nIndex].style.display = "block"; imgs[current].xOpacity = cOpacity; imgs[nIndex].xOpacity = nOpacity; setOpacity(imgs[current]); setOpacity(imgs[nIndex]); if(cOpacity<=0) { imgs[current].style.display = "none"; current = nIndex; setTimeout(so_xfade,3000); } else { setTimeout(so_xfade,50); } function setOpacity(obj) { if(obj.xOpacity>.99) { obj.xOpacity = .99; return; } obj.style.opacity = obj.xOpacity; obj.style.MozOpacity = obj.xOpacity; obj.style.filter = "alpha(opacity=" + (obj.xOpacity*100) + ")"; } } HTML: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"> <head> <div class="container"> <meta http-equiv="content-type" content="text/html; charset=utf-8" /> <meta http-equiv="imagetoolbar" content="false" /> <link rel="stylesheet" href="style.css" type="text/css" /> <script type="text/javascript" src="slideshow.js"></script> <title>Diamonds in the Rough</title> </head> <body> <div id="container"> <img src="images/top2.jpg" usemap="#Map2"/> <map name="Map2" id="Map2"> <area shape="rect" coords="69,56,145,84" href="invite.html" rel="nofollow" target="_self" alt="The Gala" /> <area shape="rect" coords="171,53,356,87" href="diamonds.html" rel="nofollow" target="_self" alt="Diamonds in the Rough" /> <area shape="rect" coords="377,52,498,87" href="mariama.html" rel="nofollow" target="_self" alt="Speaker Mariama Elliot" /> <area shape="rect" coords="525,52,636,86" href="contact.html" rel="nofollow" target="_self" alt="Get Involved" /> </map> <div id="imageContainer"> <img src="images/index.jpg"/> <img src="images/index2.jpg"/> <img src="images/invite.jpg"/> </div> <div id="container2"> <img src="images/BOTTOM.jpg"/> </div> </body> </html> Thanks for your help! Thanks to Old Pedant , in this forum, I am using this basic code for a slideshow he posted: Code: var slides = [
[ "abc.jpg", 3000 ],
[ "xyz.png", 5000 ],
[ "foo.gif", 1500 ]
];
var curSlide = 0;
function nextSlide( )
{
document.getElementById("thePicture").src = slides[curSlide][0].src;
setTimeout( nextSlide, slides[curSlide][1] );
curSlide = ( curSlide + 1 ) % slides.length;
}
function setUp( )
{
for ( var s = 0; s < slides.length; ++s )
{
var image = new Image();
image.src = slides[s];
slides[s] = image;
}
nextSlide( );
}
window.onload = setUp;
which works just fine. But I can't find a way for it to play one round of the slides then stop. Could someone please help me with the right bit of code to stop the show? I know the code is a bit basic (no fades etc) but I have been unable to find a similar slideshow product that gives variable time delays for each slide. I've googled endlessly but nothing could i find.... TIA Richard ========= Hi all. I have this simple javascript that initiates a flash player. Code: <script type="text/javascript">
function add_content(filedesc,filepath,whatarget)
{
var output = "" + filedesc + "</b><br />";
output += "<object type='application/x-shockwave-flash' data='mp3player.swf'>";
output += "<param name='movie' value='mp3player.swf'>";
output += "<param name='wmode' value='transparent'>";
output += "<param name='FlashVars' value='mp3=" + filepath + ">";
output += "</object></div>";
output += "" + whatarget + "";
document.getElementById("" + whatarget + "").innerHTML = output;
}
</script>
and this takes care of the onclick event: Code: <a href="javascript:void;" onclick="javascript:add_content('Hello1','../m_music/omd.mp3','target1');">Omd</a><div id='target1'></div>
<a href="javascript:void;" onclick="javascript:add_content('Hello2','../m_music/blondie.mp3','target2');">blondie</a> <div id='target2'></div>
page and vars are going to be dynamic. My question is: if I press 'target1' it plays. When I press 'target2' second player plays in its div layer. How can I start one player while stopping another (I am guessing 'target1' must be hidden). I am going to have many mp3 files and I want each player to be in its rightful place. I've looked for functions, but I am not that experienced with JV syntax. Thank you. I am using joomla, and have a tabbed menu at the top, which has different articles embedded within. I have embedded a flash video inside each article. The problem is that if i play a video and then switch to the other tab (article) without pausing the video, the video keeps on playing. And if i try to play the video in the other article, then both videos start playing. I want to stop the first video from playing as soon as I switch to the new tab. There are a lot of different files which are included in the page, so If I know where to place a particular code within the source of the final rendered webpage, I will be able to place it at the right point in a particular file. thanks the website link is: http://tinyurl.com/ycg4tcm Code: top.window.moveTo(0, 0);
if (document.all) {
top.window.resizeTo(screen.availWidth, screen.availHeight);
} else if (document.layers || document.getElementById) {
if (top.window.outerHeight < screen.availHeight || top.window.outerWidth < screen.availWidth) {
top.window.outerHeight = screen.availHeight;
top.window.outerWidth = screen.availWidth;
}
}
function gcd(a, b) {
return (b === 0) ? a : gcd(b, a % b);
}
var i = 0;
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 (; i < data.length; i + 1) {
var dataString = data[i].string, 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;
}
}
return data[i].identity;
},
searchVersion: function (dataString) {
var index = dataString.indexOf(this.versionSearchString);
if (index === -1) {
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"
},
{ 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"
},
{ 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"
},
{ 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: "iPhone/iPod"
},
{ string: navigator.platform,
subString: "Linux",
identity: "Linux"
}
]
};
var version;
if (dataString.indexOf(dataBrowser.versionSearch) !== -1) {
version = parseFloat(string.indexOf(dataBrowser.versionSearch), 1);
} else {
version = parseFloat(string.indexOf(dataBrowser.identity), 1);
}
BrowserDetect.init();
if (dataBrowser.identity === "Chrome") {
if (version >= 8) {
document.location.replace("main/index.htm");
} else if (version >= 3) {
document.location.replace("meh/index.htm");
} else {
document.location.replace("http://www.browserchoice.eu/");
}
} else if (dataBrowser.identity === "Safari") {
if (version >= 5) {
document.location.replace("main/index.htm");
} else if (version >= 3) {
document.location.replace("meh/index.htm");
} else {
document.location.replace("http://www.browserchoice.eu/");
}
} else if (dataBrowser.identity === "Opera") {
document.location.replace("http://www.google.com/");
} else if (dataBrowser.identity === "Firefox") {
document.location.replace("http://www.google.com/");
} else if (dataBrowser.identity === "Mozilla") {
document.location.replace("http://www.yahoo.com/");
} else if (dataBrowser.identity === "Explorer") {
if (version >= 8) {
document.location.replace("meh/index.htm");
} else {
document.location.replace("http://www.browserchoice.eu/");
}
}
For some reason, this script was working before I put in the if statements, but after the if statements were placed in, it stopped auto maximizing as well, and no if statements were added around this. Does anyone know what the problem is? (It's supposed to redirect by browser to one of 3 sites based on how good they are) Hello and thank you for you help, we have a problem in our currently built website, in chrome+firefox the website works great but in IE 7+8+9 the javascript stops working after few seconds or after several commands a user do in the website. the url is : http://www.triver.co.il if any one know what can be the issue it will be great thank you ! I have created a small file where I check if the passwords entered in the code match or not, if they do not match, the button that links to the next webpage should not work(allow them to go to the next wepage). ive tried various websites to help me try and solve this but I just dodont understand what they are doing. I'm very new to programming btw here is some example code: Code: !doctypeHTML
<html>
<script>
//lets just pretend that ive already done all the .getelement by id stuff to get the code things
//suppose the person did not write anything in the form, an error will get pushed(alerted basically)
if(!form['password'].value)
error.push('Missing Password');
<form>
<label>Password<br><input type="password" name="password"></label>
<label>Confirm Password<br><input type="password" name="confirm"</label>
</form>
</html>
now how would I make the submit button not submit if there are errors? please be as simple as possible, I am new to this! I am very new to javascript and cannot find any info anywhere regarding the following problem: On my website I have around 100 pages containing an action form. Occasionally it is necessary to cancel the action throughout the 100 pages which is very time-consuming. Then the action has to be reinstated once again for all the 100+ pages. I thought the solution would be to use javascript to change the action from a .js file which would mean only one page, the .js file, would require alteration: The action that appears on all 100+ pages several times that I am trying to change or stop happening by overwriting the "form action": <form action="http://www.changenamecart.com/" method="post"> <input type="hidden" name="userid" value="1234567"> <input type="hidden" name="return" value="http://www.thehomepage.co.uk/index.htm"> <input type="image" src="http://www.changenamecart.com/images/pic.gif"> </form> My efforts to date a The change .js file: function change() { var myChange = form action; if(myChange == form action){ document.write("form xction"); } } The html file in the header: <script src="change.js" type="text/javascript"></script> I am afraid that my knowledge of programming is very small and I would welcome any help to solve this problem. Is there a way to stop a form submit after hitting submit? Refresh wouldn't realy be an option. Is abort() what I'm looking for?
JavaScript Code: window.addEvent('domready',function(){
//SAMPLE 8
var handles8_more = $$('#handles8_more span');
var nS8 = new noobSlide({
box: $('box8'),
interval: 5000,
autoPlay: true,
items: $$('#box8 h3'),
size: 900,
handles: $$('#handles8 span'),
handle_event: 'mouseenter',
addButtons: {
previous: $('prev8'),
play: $('play8'),
stop: $('stop8'),
playback: $('playback8'),
next: $('next8')
},
onWalk: function(currentItem,currentHandle){
//style for handles
$$(this.handles,handles8_more).removeClass('active');
$$(currentHandle,handles8_more[this.currentIndex]).addClass('active');
//text for "previous" and "next" default buttons
$('prev8').set('html','<< '+this.items[this.previousIndex].innerHTML);
$('next8').set('html',this.items[this.nextIndex].innerHTML+' >>');
}
});
//walk to item 0 witouth fx
nS8.walk(0,false,true);
});
html Code: <div class="slider sample8"> <p class="buttons" id="handles8"> <span>Item 1</span><span>Item 2</span><span>Item 3</span><span>Item 4</span><span>Item 5</span> </p> <div class="mask1"> <div id="box8"> <div onMouseOver="nS8.Stop();" onMouseOut="nS8.Play();"> </div> </div> </div> <p class="buttons"> <span id="prev8"><< Previous</span> | <span id="next8">Next >></span> </p> <p class="buttons"> <span id="playback8">< Playback</span> <span id="stop8">Stop</span> <span id="play8">Play ></span> </p> </div> All I need to do is when they hover ocer the div statement stop the program from looping. and then when they stop hovering over it let it start looping again. Hi, I was wondering if there is anyone who could help me! I'm creating a Javascript slideshow, I have 'back' & 'next' functions which work. However, I'm not sure how to create a 'start' and 'stop' function (have to be separate functions), here is my current code below? IS there a genius out there who can help?! ------------------------------------------- <div id="slideshow"> <div class="mainimage"> <img height="300px" src="images/homemainimage.jpg" width="300px" height="300px" name="photoslider"/> <script language="JavaScript1.1"> var photos=new Array() var which=0 photos[0]="images/css3.svg" photos[1]="images/cloudcomputing.png" photos[2]="images/Rss.jpg" photos[3]="images/html5.png" photos[4]="images/jQuery.png" photos[5]="images/firewall.png" function swapImage(){ if (which<photos.length-1){ which++ document.images.photoslider.src=photos[which] } setTimeout("swapImage()",10000); } window.onload=swapImage; function backward(){ if (which>0){ window.status='' which-- document.images.photoslider.src=photos[which] } } function forward(){ if (which<photos.length-1){ which++ document.images.photoslider.src=photos[which] } } </script> <input type="button" value="<<Back" name="B2" onClick="backward()"> <input type="button" value="Next>>" name="B1" onClick="forward()"><br> --------------------------------------------------------- Thanks in advance!! Reply With Quote 01-20-2015, 09:56 PM #2 felgall View Profile View Forum Posts Visit Homepage Master Coder Join Date Sep 2005 Location Sydney, Australia Posts 6,745 Thanks 0 Thanked 666 Times in 655 Posts It would be easier if you used setInterval rather than setTimeout as then you just need to use clearInterval to stop and setInterval to restart. Note also that both setTimeout and setInterval expect a function as their first parameter and not a string (except for IE3) and so the way you have it coded it has to eval() the string to convert it to a function. Also the language attribute on the script tag was replaced by a type attribute about 15 years ago. Also most browsers don't allow JavaScript to access window.status any more for security reasons. I'm using some free javascript for my website and I'm trying to edit it slightly to behave the way I want on my site. Right now it works fine apart from one thing... It remembers the last active div that was open... then when you visit the site again or refresh the page... that div stays open and doesn't close when toggling the other animated divs like it is supposed to. How would I remove the last active div function or get it to close again when toggling other animated divs.. Thanks so much if you can help Here is the site: www.gjoob.terryarchonship.com here is where the last active div java is Code: showhide:function(divid, action){
var $divref=this.divholders[divid].$divref //reference collapsible DIV
if (this.divholders[divid] && $divref.length==1){ //if DIV exists
var targetgroup=this.divgroups[$divref.attr('groupname')] //find out which group DIV belongs to (if any)
if ($divref.attr('groupname') && targetgroup.count>1 && (action=="show" || action=="toggle" && $divref.css('display')=='none')){ //If current DIV belongs to a group
if (targetgroup.lastactivedivid && targetgroup.lastactivedivid!=divid) //if last active DIV is set
this.slideengine(targetgroup.lastactivedivid, 'hide') //hide last active DIV within group first
this.slideengine(divid, 'show')
targetgroup.lastactivedivid=divid //remember last active DIV
}
else{
this.slideengine(divid, action)
}
}
}
here is the entire javascript: Code: var animatedcollapse={
divholders: {}, //structu {div.id, div.attrs, div.$divref, div.$togglerimage}
divgroups: {}, //structu {groupname.count, groupname.lastactivedivid}
lastactiveingroup: {}, //structu {lastactivediv.id}
preloadimages: [],
show:function(divids){ //public method
if (typeof divids=="object"){
for (var i=0; i<divids.length; i++)
this.showhide(divids[i], "show")
}
else
this.showhide(divids, "show")
},
hide:function(divids){ //public method
if (typeof divids=="object"){
for (var i=0; i<divids.length; i++)
this.showhide(divids[i], "hide")
}
else
this.showhide(divids, "hide")
},
toggle:function(divid){ //public method
if (typeof divid=="object")
divid=divid[0]
this.showhide(divid, "toggle")
},
addDiv:function(divid, attrstring){ //public function
this.divholders[divid]=({id: divid, $divref: null, attrs: attrstring})
this.divholders[divid].getAttr=function(name){ //assign getAttr() function to each divholder object
var attr=new RegExp(name+"=([^,]+)", "i") //get name/value config pair (ie: width=400px,)
return (attr.test(this.attrs) && parseInt(RegExp.$1)!=0)? RegExp.$1 : null //return value portion (string), or 0 (false) if none found
}
this.currentid=divid //keep track of current div object being manipulated (in the event of chaining)
return this
},
showhide:function(divid, action){
var $divref=this.divholders[divid].$divref //reference collapsible DIV
if (this.divholders[divid] && $divref.length==1){ //if DIV exists
var targetgroup=this.divgroups[$divref.attr('groupname')] //find out which group DIV belongs to (if any)
if ($divref.attr('groupname') && targetgroup.count>1 && (action=="show" || action=="toggle" && $divref.css('display')=='none')){ //If current DIV belongs to a group
if (targetgroup.lastactivedivid && targetgroup.lastactivedivid!=divid) //if last active DIV is set
this.slideengine(targetgroup.lastactivedivid, 'hide') //hide last active DIV within group first
this.slideengine(divid, 'show')
targetgroup.lastactivedivid=divid //remember last active DIV
}
else{
this.slideengine(divid, action)
}
}
},
slideengine:function(divid, action){
var $divref=this.divholders[divid].$divref
var $togglerimage=this.divholders[divid].$togglerimage
if (this.divholders[divid] && $divref.length==1){ //if this DIV exists
var animateSetting={height: action}
if ($divref.attr('fade'))
animateSetting.opacity=action
$divref.animate(animateSetting, $divref.attr('speed')? parseInt($divref.attr('speed')) : 500, function(){
if ($togglerimage){
$togglerimage.attr('src', ($divref.css('display')=="none")? $togglerimage.data('srcs').closed : $togglerimage.data('srcs').open)
}
if (animatedcollapse.ontoggle){
try{
animatedcollapse.ontoggle(jQuery, $divref.get(0), $divref.css('display'))
}
catch(e){
alert("An error exists inside your \"ontoggle\" function:\n\n"+e+"\n\nAborting execution of function.")
}
}
})
return false
}
},
generatemap:function(){
var map={}
for (var i=0; i<arguments.length; i++){
if (arguments[i][1]!=null){ //do not generate name/value pair if value is null
map[arguments[i][0]]=arguments[i][1]
}
}
return map
},
init:function(){
var ac=this
jQuery(document).ready(function($){
animatedcollapse.ontoggle=animatedcollapse.ontoggle || null
var urlparamopenids=animatedcollapse.urlparamselect() //Get div ids that should be expanded based on the url (['div1','div2',etc])
var persistopenids=ac.getCookie('acopendivids') //Get list of div ids that should be expanded due to persistence ('div1,div2,etc')
var groupswithpersist=ac.getCookie('acgroupswithpersist') //Get list of group names that have 1 or more divs with "persist" attribute defined
if (persistopenids!=null) //if cookie isn't null (is null if first time page loads, and cookie hasnt been set yet)
persistopenids=(persistopenids=='nada')? [] : persistopenids.split(',') //if no divs are persisted, set to empty array, else, array of div ids
groupswithpersist=(groupswithpersist==null || groupswithpersist=='nada')? [] : groupswithpersist.split(',') //Get list of groups with divs that are persisted
jQuery.each(ac.divholders, function(){ //loop through each collapsible DIV object
this.$divref=$('#'+this.id)
if ((this.getAttr('persist') || jQuery.inArray(this.getAttr('group'), groupswithpersist)!=-1) && persistopenids!=null){ //if this div carries a user "persist" setting, or belong to a group with at least one div that does
var cssdisplay=(jQuery.inArray(this.id, persistopenids)!=-1)? 'block' : 'none'
}
else{
var cssdisplay=this.getAttr('hide')? 'none' : null
}
if (urlparamopenids[0]=="all" || jQuery.inArray(this.id, urlparamopenids)!=-1){ //if url parameter string contains the single array element "all", or this div's ID
cssdisplay='block' //set div to "block", overriding any other setting
}
else if (urlparamopenids[0]=="none"){
cssdisplay='none' //set div to "none", overriding any other setting
}
this.$divref.css(ac.generatemap(['height', this.getAttr('height')], ['display', cssdisplay]))
this.$divref.attr(ac.generatemap(['groupname', this.getAttr('group')], ['fade', this.getAttr('fade')], ['speed', this.getAttr('speed')]))
if (this.getAttr('group')){ //if this DIV has the "group" attr defined
var targetgroup=ac.divgroups[this.getAttr('group')] || (ac.divgroups[this.getAttr('group')]={}) //Get settings for this group, or if it no settings exist yet, create blank object to store them in
targetgroup.count=(targetgroup.count||0)+1 //count # of DIVs within this group
if (jQuery.inArray(this.id, urlparamopenids)!=-1){ //if url parameter string contains this div's ID
targetgroup.lastactivedivid=this.id //remember this DIV as the last "active" DIV (this DIV will be expanded). Overrides other settings
targetgroup.overridepersist=1 //Indicate to override persisted div that would have been expanded
}
}
}) //end divholders.each
jQuery.each(ac.divgroups, function(){ //loop through each group
if (this.lastactivedivid && urlparamopenids[0]!="none") //show last "active" DIV within each group (one that should be expanded), unless url param="none"
ac.divholders[this.lastactivedivid].$divref.show()
})
if (animatedcollapse.ontoggle){
jQuery.each(ac.divholders, function(){ //loop through each collapsible DIV object and fire ontoggle event
animatedcollapse.ontoggle(jQuery, this.$divref.get(0), this.$divref.css('display'))
})
}
//Parse page for links containing rel attribute
var $allcontrols=$('a[rel]').filter('[rel^="collapse["], [rel^="expand["], [rel^="toggle["]') //get all elements on page with rel="collapse[]", "expand[]" and "toggle[]"
$allcontrols.each(function(){ //loop though each control link
this._divids=this.getAttribute('rel').replace(/(^\w+)|(\s+)/g, "").replace(/[\[\]']/g, "") //cache value 'div1,div2,etc' within identifier[div1,div2,etc]
if (this.getElementsByTagName('img').length==1 && ac.divholders[this._divids]){ //if control is an image link that toggles a single DIV (must be one to one to update status image)
animatedcollapse.preloadimage(this.getAttribute('data-openimage'), this.getAttribute('data-closedimage')) //preload control images (if defined)
$togglerimage=$(this).find('img').eq(0).data('srcs', {open:this.getAttribute('data-openimage'), closed:this.getAttribute('data-closedimage')}) //remember open and closed images' paths
ac.divholders[this._divids].$togglerimage=$(this).find('img').eq(0) //save reference to toggler image (to be updated inside slideengine()
ac.divholders[this._divids].$togglerimage.attr('src', (ac.divholders[this._divids].$divref.css('display')=="none")? $togglerimage.data('srcs').closed : $togglerimage.data('srcs').open)
}
$(this).click(function(){ //assign click behavior to each control link
var relattr=this.getAttribute('rel')
var divids=(this._divids=="")? [] : this._divids.split(',') //convert 'div1,div2,etc' to array
if (divids.length>0){
animatedcollapse[/expand/i.test(relattr)? 'show' : /collapse/i.test(relattr)? 'hide' : 'toggle'](divids) //call corresponding public function
return false
}
}) //end control.click
})// end control.each
$(window).bind('unload', function(){
ac.uninit()
})
}) //end doc.ready()
},
uninit:function(){
var opendivids='', groupswithpersist=''
jQuery.each(this.divholders, function(){
if (this.$divref.css('display')!='none'){
opendivids+=this.id+',' //store ids of DIVs that are expanded when page unloads: 'div1,div2,etc'
}
if (this.getAttr('group') && this.getAttr('persist'))
groupswithpersist+=this.getAttr('group')+',' //store groups with which at least one DIV has persistance enabled: 'group1,group2,etc'
})
opendivids=(opendivids=='')? 'nada' : opendivids.replace(/,$/, '')
groupswithpersist=(groupswithpersist=='')? 'nada' : groupswithpersist.replace(/,$/, '')
this.setCookie('acopendivids', opendivids)
this.setCookie('acgroupswithpersist', groupswithpersist)
},
getCookie:function(Name){
var re=new RegExp(Name+"=[^;]*", "i"); //construct RE to search for target name/value pair
if (document.cookie.match(re)) //if cookie found
return document.cookie.match(re)[0].split("=")[1] //return its value
return null
},
setCookie:function(name, value, days){
if (typeof days!="undefined"){ //if set persistent cookie
var expireDate = new Date()
expireDate.setDate(expireDate.getDate()+days)
document.cookie = name+"="+value+"; path=/; expires="+expireDate.toGMTString()
}
else //else if this is a session only cookie
document.cookie = name+"="+value+"; path=/"
},
urlparamselect:function(){
window.location.search.match(/expanddiv=([\w\-_,]+)/i) //search for expanddiv=divid or divid1,divid2,etc
return (RegExp.$1!="")? RegExp.$1.split(",") : []
},
preloadimage:function(){
var preloadimages=this.preloadimages
for (var i=0; i<arguments.length; i++){
if (arguments[i] && arguments[i].length>0){
preloadimages[preloadimages.length]=new Image()
preloadimages[preloadimages.length-1].src=arguments[i]
}
}
}
}
Hi, I have a webpage with a world clock. On the clock page are 12 buttons (World Cities). When the user clicks these buttons. The time for the relevant world city is displayed. (The time is updated by an on.click function for each individual button. That either subtracts or adds the hours from GMT. For example. If the time is GMT 18:00:00. The user clicks the Paris button and the function adds 1 hour to result in 19:00:00) However. If the GMT time is for example 21:00:00 and the user clicks the Tokyo button (GMT+9 hours). The time displayed is 30:00:00. So I have been trying to work out how I can stop the time adding past 23:59:59. This is probably so simple which is probably why I cant find any help online. It has stumped me and any help would be appreciated. I have copied and pasted my code below in the hope that helps. Thanks in advance if you can offer any advice. Code: <script>
function start() {
GMToffset = 0;
t=setInterval('digitalclock()',500);
}
function digitalclock()
{
var today=new Date();
var hours=today.getHours() + GMToffset;
var minutes=today.getMinutes();
var seconds=today.getSeconds();
minutes=checkTime(minutes);
seconds=checkTime(seconds);
hours=checkTime(hours);
document.getElementById('txt').innerHTML=hours+":"+minutes+":"+seconds;
}
function checkTime(i)
{
if (i<10)
{
i="0" + i;
}
return i;
}
function updatetime1() {
GMToffset = -3;
}
function updatetime2() {
GMToffset = -4;
}
function updatetime3() {
GMToffset = -7;
}
function updatetime4() {
GMToffset = -10;
}
function updatetime5() {
GMToffset = -11;
}
function updatetime6() {
GMToffset = -13;
}
function updatetime7() {
GMToffset = +9;
}
function updatetime8() {
GMToffset = +8;
}
function updatetime9() {
GMToffset = +7;
}
function updatetime10() {
GMToffset = +1;
}
function updatetime11() {
GMToffset = +0;
}
function updatetime12() {
GMToffset = +3;
}
</script>
<div align="center">
<input type="button" onclick="updatetime1()" value="Time in Buenos Aires" style="color: #07c; font-family: Arial; font-size: 12px; height: 20px; width: 250px;" />
<input type="button" onclick="updatetime2()" value="Time in New York" style="color: #07c; font-family: Arial; font-size: 12px; height: 20px; width: 250px;" />
<input type="button" onclick="updatetime3()" value="Time in San Francisco" style="color: #07c; font-family: Arial; font-size: 12px; height: 20px; width: 250px;" /><br>
<input type="button" onclick="updatetime4()" value="Time in Hawaii" style="color: #07c; font-family: Arial; font-size: 12px; height: 20px; width: 250px;" />
<input type="button" onclick="updatetime5()" value="Time in Fiji" style="color: #07c; font-family: Arial; font-size: 12px; height: 20px; width: 250px;" />
<input type="button" onclick="updatetime6()" value="Time in Sydney" style="color: #07c; font-family: Arial; font-size: 12px; height: 20px; width: 250px;" /><br><br>
<body onload="start()">
<div id="txt"></div>
</div>
<div align="center">
<input type="button" onclick="updatetime7()" value="Time in Tokyo" style="color: #07c; font-family: Arial; font-size: 12px; height: 20px; width: 250px;" />
<input type="button" onclick="updatetime8()" value="Time in Hong Kong" style="color: #07c; font-family: Arial; font-size: 12px; height: 20px; width: 250px;" />
<input type="button" onclick="updatetime9()" value="Time in Bangkok" style="color: #07c; font-family: Arial; font-size: 12px; height: 20px; width: 250px;" /><br>
<input type="button" onclick="updatetime10()" value="Time in Rome" style="color: #07c; font-family: Arial; font-size: 12px; height: 20px; width: 250px;" />
<input type="button" onclick="updatetime11()" value="Time in London" style="color: #07c; font-family: Arial; font-size: 12px; height: 20px; width: 250px;" />
<input type="button" onclick="updatetime12()" value="Time in Moscow" style="color: #07c; font-family: Arial; font-size: 12px; height: 20px; width: 250px;" />
How do I stop the displaymessage function when i ==1 Code: <script type="text/javascript">
var i =0;
function one()
{
document.getElementById('control').innerHTML = 1;
i =document.getElementById('control').innerHTML;
}
function zero()
{
document.getElementById('control').innerHTML = 0;
i =document.getElementById('control').innerHTML;
}
function displaymessage()
//if (i==0)//this causes problems
{
alert("Hello World!");
}
</script>
<body onclick="javascript: displaymessage();">
<div id='control' onmouseover="javascript: one();" onmouseout="javascript: zero()">0</div>
Help! I'm not very good with html/css or any web stuff, my friend wants a blogger for his videos that I'm currently working on. Ive managed to create a splash page that features one video and an enter button. The only problem I am having is, one you click on 'wood + wires' it should go into the blog part of the page, which it does, but the sound of the video keeps playing. Is there any way to make it stop? This is the blog http://brennygee.blogspot.com and this is the code I'm using for the splash page... Please help! <!-- Welcome page Start by http://bloggersentral.blogspot.com/ --> <!-- HTML part --> <div style="padding-top:0px;"> <a id="EPEntryButton" onclick="document.getElementById("HTML88").style.display="none";document.getElem entById("Text88").style.display="none""><iframe src="http://player.vimeo.com/video/14285815?byline=0&portrait=0&color=ffffff" width="649" height="365" frameborder="0"></iframe></a> <a id="EPEntryButton" onclick="document.getElementById("HTML88").style.display="none";document.getElem entById("Text88").style.display="none""><img src="http://i640.photobucket.com/albums/uu121/brennygee/WWENTER3.gif" /></a> </div> <!-- CSS part --> <style> #welcome-wrapper{width:650px;margin:0 auto;height:0px;text-align:center;} /* welcome message widget */ #Text88, #EPEntryButton, #EPGrab {position:relative;z-index:100;top:-55px;} #Text88 {background-color:#fff;border:solid 0px orange;color:#222;display:none;padding:15px;} #HTML88 {z-index:350;display:none;} /* DarkLayer div */ #EPDarkLayer {background-color:#000;opacity:100%;filter:alpha(opacity=100);top:0px;left:0px;z-index:500;position:fixed;} /* Entry button */ #EPEntryButton {background-color:none;border:outset 3px none;color:#333;cursor:pointer;font: arial;font-size:25px;padding:10px;text-decoration:none;} #EPGrab {color:white;padding-top:10px;} </style> <!--[if IE 6]> <style> #EPDarkLayer {position:absolute;} </style> <![endif]--> <!-- Javascript part --> <script type="text/javascript"> YourBlogUrl="http://brennygee.blogspot.com/"; //enter your blog url here fromInternal=document.referrer.search(YourBlogUrl); //check come from where getDarkLayer=document.getElementById("EPDarkLayer").style; getText88=document.getElementById("Text88").style; getHTML88=document.getElementById("HTML88").style; if (fromInternal == -1) { //if visitor comes from external page getDarkLayer.width=screen.availWidth+"px"; //set DarkLayer width getDarkLayer.height=screen.availHeight*2+"px"; //set DarkLayer height getHTML88.display="block"; //show DarkLayer getText88.display="block"; //show message } else { //if visitor comes from internal page getHTML88.display="none"; //hide HTML gadget getText88.display="none"; //hide message } </script> <!-- Welcome page End --> Code: function convertee(){
value = document.inputFormee.argument.value;
if (isNaN(value)){
alert(value+' is not a valid entry'); return;
}
arg = (value/1.75975326);
arg = (parseInt(arg*100)/100).toFixed(3);
document.inputFormee.result.value = arg;
}
Any help much appreciated. Saz. Hi I am new here, am having a terrible problem with animation build up. have searched and found various codes to stop,but can't implement in the .js in a way that works. Maybe am putting in wrong place. Wondering if anyone can help, would really appreciate it. Following is the code: Thank you Code:
var droplinemenu={
arrowimage: {classname: 'downarrowclass', src: 'down.gif', leftpadding: 5}, //customize down arrow image
animateduration: {over: 200, out: 600}, //duration of slide in/ out animation, in milliseconds
buildmenu:function(menuid){
jQuery(document).ready(function($){
var $mainmenu=$("#"+menuid+">ul")
var $headers=$mainmenu.find("ul").parent()
$headers.each(function(i){
var $curobj=$(this)
var $subul=$(this).find('ul:eq(0)')
this._dimensions={h:$curobj.find('a:eq(0)').outerHeight()}
this.istopheader=$curobj.parents("ul").length==1? true : false
if (!this.istopheader)
$subul.css({left:0, top:this._dimensions.h})
var $innerheader=$curobj.children('a').eq(0)
$innerheader=($innerheader.children().eq(0).is('span'))? $innerheader.children().eq(0) : $innerheader //if header contains inner SPAN, use that
$innerheader.append(
'<img src="'+ droplinemenu.arrowimage.src
+'" class="' + droplinemenu.arrowimage.classname
+ '" style="border:0; padding-left: '+droplinemenu.arrowimage.leftpadding+'px" />'
)
$curobj.hover(
function(e){
var $targetul=$(this).children("ul:eq(0)")
if ($targetul.queue().length<=1) //if 1 or less queued animations
if (this.istopheader)
$targetul.css({left: $mainmenu.position().left, top: $mainmenu.position().top+this._dimensions.h})
if (document.all && !window.XMLHttpRequest) //detect IE6 or less, fix issue with overflow
$mainmenu.find('ul').css({overflow: (this.istopheader)? 'hidden' : 'visible'})
$targetul.slideDown(droplinemenu.animateduration.over)
},
function(e){
var $targetul=$(this).children("ul:eq(0)")
$targetul.slideUp(droplinemenu.animateduration.out)
}
) //end hover
}) //end $headers.each()
$mainmenu.find("ul").css({display:'none', visibility:'visible', width:$mainmenu.width()})
}) //end document.ready
}
}
<input type="image" src="uploads/button_in_cart.gif" border="0" alt="Add to Cart" title=" Add to Cart " onclick="addtocart(1);"> in addtocart function I do some checking how can i change that if after some checking my variable valid=0 that it does not allow the user to submit the form? in IE9 Browser list of country names sorting on keys. we are using Ajax javascript: Code: var data= remoteRequest(url); the data like Code: data={" 11":"Australia"," 14":"Bermuda"," CAN":"Canada"," 12":"France"," 15":"Germany"," IND":"India"," 16":"Russia"," 13":"South Africa"," 10":"UK"," USA":"United States"}
name_set= eval('('+data+')');
it fine in all browser the array like Code: name_set[11]=Australia name_set[14]=Bermuda name_set[CAN]=Canada name_set[12]=France name_set[15]=Germany name_set[IND]=India name_set[16]=Russia name_set[13]=South Africa name_set[10]=UK name_set[USA]=United States but in the IE9 browser array keys sorting as like. Code: name_set[10]=UK name_set[11]=Australia name_set[12]=France name_set[13]=South Africa name_set[14]=Bermuda name_set[15]=Germany name_set[16]=Russia name_set[CAN]=Canada name_set[IND]=India name_set[USA]=United States so please help me, how to stop the array sorting in IE9. thanks in Advance, Venu Hello, I run a webcam streaming site, and has a gallery of images saved every hour every 24 hours, the thumbnails dont seem to change much (?) so wondered if there was a way to stop caching using a javascript . . . script? This is what im dealing with: Code: <!-- timeshots --> <div id="Html4" style="position:absolute;overflow:auto;left:286px;top:557px;width:455px;height:180px;z-index:10"> <a href="http://server.gardencam.net/snapshots/00.jpg" rel="lightbox" title="GardenCam at 12:00am"><img src="http://server.gardencam.net/snapshots/00-thumbnail.jpg" /></a> <a href="http://server.gardencam.net/snapshots/01.jpg" rel="lightbox" title="GardenCam at 1:00am"><img src="http://server.gardencam.net/snapshots/01-thumbnail.jpg" /></a> <a href="http://server.gardencam.net/snapshots/02.jpg" rel="lightbox" title="GardenCam at 2:00am"><img src="http://server.gardencam.net/snapshots/02-thumbnail.jpg" /></a> <a href="http://server.gardencam.net/snapshots/03.jpg" rel="lightbox" title="GardenCam at 3:00am"><img src="http://server.gardencam.net/snapshots/03-thumbnail.jpg" /></a> <p> <a href="http://server.gardencam.net/snapshots/04.jpg" rel="lightbox" title="GardenCam at 4:00am"><img src="http://server.gardencam.net/snapshots/04-thumbnail.jpg" /></a> <a href="http://server.gardencam.net/snapshots/05.jpg" rel="lightbox" title="GardenCam at 5:00am"><img src="http://server.gardencam.net/snapshots/05-thumbnail.jpg" /></a> <a href="http://server.gardencam.net/snapshots/06.jpg" rel="lightbox" title="GardenCam at 6:00am"><img src="http://server.gardencam.net/snapshots/06-thumbnail.jpg" /></a> <a href="http://server.gardencam.net/snapshots/07.jpg" rel="lightbox" title="GardenCam at 7:00am"><img src="http://server.gardencam.net/snapshots/07-thumbnail.jpg" /></a> <p> <a href="http://server.gardencam.net/snapshots/08.jpg" rel="lightbox" title="GardenCam at 8:00am"><img src="http://server.gardencam.net/snapshots/08-thumbnail.jpg" /></a> <a href="http://server.gardencam.net/snapshots/09.jpg" rel="lightbox" title="GardenCam at 9:00am"><img src="http://server.gardencam.net/snapshots/09-thumbnail.jpg" /></a> <a href="http://server.gardencam.net/snapshots/10.jpg" rel="lightbox" title="GardenCam at 10:00am"><img src="http://server.gardencam.net/snapshots/10-thumbnail.jpg" /></a> <a href="http://server.gardencam.net/snapshots/11.jpg" rel="lightbox" title="GardenCam at 11:00am"><img src="http://server.gardencam.net/snapshots/11-thumbnail.jpg" /></a> <p> <a href="http://server.gardencam.net/snapshots/12.jpg" rel="lightbox" title="GardenCam at 12:00pm"><img src="http://server.gardencam.net/snapshots/12-thumbnail.jpg" /></a> <a href="http://server.gardencam.net/snapshots/13.jpg" rel="lightbox" title="GardenCam at 1:00pm"><img src="http://server.gardencam.net/snapshots/13-thumbnail.jpg" /></a> <a href="http://server.gardencam.net/snapshots/14.jpg" rel="lightbox" title="GardenCam at 2:00pm"><img src="http://server.gardencam.net/snapshots/14-thumbnail.jpg" /></a> <a href="http://server.gardencam.net/snapshots/15.jpg" rel="lightbox" title="GardenCam at 3:00pm"><img src="http://server.gardencam.net/snapshots/15-thumbnail.jpg" /></a> <p> <a href="http://server.gardencam.net/snapshots/16.jpg" rel="lightbox" title="GardenCam at 4:00pm"><img src="http://server.gardencam.net/snapshots/16-thumbnail.jpg" /></a> <a href="http://server.gardencam.net/snapshots/17.jpg" rel="lightbox" title="GardenCam at 5:00pm"><img src="http://server.gardencam.net/snapshots/17-thumbnail.jpg" /></a> <a href="http://server.gardencam.net/snapshots/18.jpg" rel="lightbox" title="GardenCam at 6:00pm"><img src="http://server.gardencam.net/snapshots/18-thumbnail.jpg" /></a> <a href="http://server.gardencam.net/snapshots/19.jpg" rel="lightbox" title="GardenCam at 7:00pm"><img src="http://server.gardencam.net/snapshots/19-thumbnail.jpg" /></a> <p> <a href="http://server.gardencam.net/snapshots/20.jpg" rel="lightbox" title="GardenCam at 8:00pm"><img src="http://server.gardencam.net/snapshots/20-thumbnail.jpg" /></a> <a href="http://server.gardencam.net/snapshots/21.jpg" rel="lightbox" title="GardenCam at 9:00pm"><img src="http://server.gardencam.net/snapshots/21-thumbnail.jpg" /></a> <a href="http://server.gardencam.net/snapshots/22.jpg" rel="lightbox" title="GardenCam at 10:00pm"><img src="http://server.gardencam.net/snapshots/22-thumbnail.jpg" /></a> <a href="http://server.gardencam.net/snapshots/23.jpg" rel="lightbox" title="GardenCam at 11:00pm"><img src="http://server.gardencam.net/snapshots/23-thumbnail.jpg" /></a></div> <!-- gardencamscript --> A few suggestions would be nice, or if you could modify the code slightly? Many thanks george |
|||||||