|
JavaScript - Help Please! Javascript Slideshow - Back, Next, Start, Stop Functions
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. Similar TutorialsJquery, Jcarousel problems - want it to go back to the start and then stop Here is the link - I want it to go from the last - which would be the 3rd image and swoosh back to the beginning and stop. my alternative is already uploaded where I have it just go to the 4th which is the same at the first.. Help it would look nicer with it swooshing back to the beginning and stopping. http://www.macrojump.com/sti_demo/home.php Code: $(document).ready( function() {
function carouselInit(carousel) {
$('.level0-hero-carousel .carousel-control a').bind('click', function() {
carousel.scroll( parseInt( $(this).attr('rel') ) );
carousel.stopAuto();
return false;
});
carousel.clip.hover(function() {
//carousel.stopAuto();
}, function() {
//carousel.startAuto();
});
};
function firstItemAction(carousel, item, idx, state) {
$('.level0-hero-carousel .carousel-control a').removeClass('active').eq(idx-1).addClass('active');
};
$('.level0-hero-carousel').jcarousel({
scroll: 1,
initCallback: carouselInit,
itemFirstInCallback: firstItemAction,
auto: 4,
wrap: 'first',
animation: 1500,
buttonNextHTML: null,
buttonPrevHTML: null
});
if( $('.level0-hero-carousel ul li').size() > 1 )
$('.level0-hero-carousel .carousel-control').show();
$('.level0-hero-carousel .carousel-control a').hover(function() {
$(this).addClass('hover');
}, function() {
$(this).removeClass('hover');
});
/* Alerts */
$('.level0-alerts ul li').eq(0).show();
var alertsInterval = null;
var alertsIndex = 0;
var alertsIntervalLength = 1500;
var alertsCount = $('.level0-alerts ul li').size();
var expandedSizeClass = 'level0-alerts-expanded-' + alertsCount;
// Update NumAlerts Text
$('.level0-alerts .alerts-toggle span').text(
alertsCount + ' Alerts'
);
$('.level0-alerts .alerts-controls .alerts-toggle').bind('click', function() {
var itemsCount = $('.level0-alerts ul li').size();
if( $('.level0-alerts').hasClass('level0-alerts-expanded') ) {
$('.level0-alerts').removeClass('level0-alerts-expanded');
$('.level0-alerts').removeClass(expandedSizeClass);
switchAlert();
startAlertsInterval();
} else {
$('.level0-alerts').addClass('level0-alerts-expanded');
$('.level0-alerts').addClass(expandedSizeClass);
$('.level0-alerts ul li').show();
stopAlertsInterval();
}
return false;
});
var switchAlert = function() {
$('.level0-alerts ul li').hide();
alertsIndex++;
$('.level0-alerts ul li').eq(alertsIndex % alertsCount).show();
}
var startAlertsInterval = function() {
if(alertsInterval == null)
alertsInterval = setInterval(switchAlert, alertsIntervalLength);
}
var stopAlertsInterval = function() {
if(alertsInterval != null) {
clearInterval(alertsInterval);
alertsInterval = null;
}
}
if(alertsCount > 1) {
$('.level0-alerts .alerts-controls').show();
startAlertsInterval();
}
});
/*
* jQuery Placeholder Plug-in
*
* Copyright (c) 2010 Max Davis
*
* Dual licensed under the MIT and GPL licenses:
* http://www.opensource.org/licenses/mit-license.php
* http://www.gnu.org/licenses/gpl.html
*
* Revision: 1
* Version: 0.1
*
* v0.1
* - First public release
*
*/
(function($){
$.fn.placeholder = function() {
$(this).each( function() {
if($(this).attr("type") == "password") {
var original_pass_field = $(this);
if(original_pass_field.val() == "") {
$(this).parent().append("<input type=\"text\" value=\""+ $(this).attr("placeholder") +"\" name=\"pass_placeholder\" class=\"form-text placeholder-inactive\" id=\"pass_placeholder\">");
$(this).css("display","none");
}
var original_pass_field = $(this);
$("#pass_placeholder").focus(function() {
if(original_pass_field.val() == "") {
$("#pass_placeholder").css("display","none");
original_pass_field.css("display","");
original_pass_field.focus();
}
});
original_pass_field.blur(function() {
if(original_pass_field.val() == "") {
$("#pass_placeholder").css("display","");
original_pass_field.css("display","none");
}
});
} else {
if($(this).val() === "") {
$(this).val($(this).attr("placeholder"));
$(this).addClass('placeholder-inactive');
}
$(this).focus(function() {
if($(this).val() === $(this).attr("placeholder")) {
$(this).removeClass('placeholder-inactive').addClass('placeholder-active');
$(this).val("");
}
}).blur(function() {
if($(this).val() === "") {
$(this).removeClass('placeholder-active').addClass('placeholder-inactive');
$(this).val($(this).attr("placeholder"));
}
});
}
} )
}
})(jQuery);
Hey guys, I am new at JavaScript, but I have been able to piece together some code for a stopwatch. I have everything the way I want it in regards to the function and look of the stopwatch, but I want to be able to set timers so that the ss() function in the code below will go and stop automatically at intervals I can set. I just can't seem to get there with this one and any help is greatly appreciated. Thank you for your time. Code: <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>Test</title>
<script type="text/javascript">
var t=[0, 0, 0, 0, 0, 0, 0, 1];
document.onkeyup=function(event) {
if((event.which && event.which === 32) || (event.keyCode && event.keyCode === 32))
{
ss()
}
}
function ss()
{
t[t[2]]=(new Date()).valueOf();
t[2]=1-t[2];
if (0==t[2])
{
clearInterval(t[4]);
t[3]+=t[1]-t[0];
t[4]=t[1]=t[0]=0;
disp();
}
else
{
t[4]=setInterval(disp, 43);
}
}
function r()
{
if (t[2]) ss();
t[4]=t[3]=t[2]=t[1]=t[0]=0;
disp();
t[7]=1;
}
function disp()
{
if (t[2]) t[1]=(new Date()).valueOf();
t[6].value=format(t[3]+t[1]-t[0]);
}
function format(ms)
{
var d=new Date(ms+t[5]).toString()
.replace(/.*([0-9][0-9]:[0-9][0-9]:[0-9][0-9]).*/, '$1');
var x=String(ms%1000);
while (x.length<3) x='0'+x;
d+='.'+x;
return d;
}
function load()
{
t[5]=new Date(1970, 1, 1, 0, 0, 0, 0).valueOf();
t[6]=document.getElementById("disp");
disp();
}
</script>
</head>
<body onload='load();'>
<div></div>
<input type="text" style="border: none" id="disp" readonly />
<style type="text/css">
#disp {
font-size: 180px;
text-align: center;
font-family: Verdana;
}
</style>
</body>
<form>
</form>
</html>
I 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 ========= my problem is when the page loads, the javascript slideshow starts to play even if the image has not yet finished loading... in effect the first image is not displayed since the image is still loading.. what i hopefully want is to start the slide show when all the images has loaded so that the slideshow will run smooth.. Code: <div id="slideshow">
<img src="Image/image1.jpg" alt="Slideshow Image 1" class="active" />
<img src="Image/image2.jpg" alt="Slideshow Image 2" />
<img src="Image/image3.jpg" alt="Slideshow Image 3" />
<img src="Image/image4.jpg" alt="Slideshow Image 4" />
</div>
javascript Code: function slideSwitch() {
var $active = $('#slideshow IMG.active');
if ( $active.length == 0 ) $active = $('#slideshow IMG:last');
// use this to pull the images in the order they appear in the markup
var $next = $active.next().length ? $active.next()
: $('#slideshow IMG:first');
// uncomment the 3 lines below to pull the images in random order
// var $sibs = $active.siblings();
// var rndNum = Math.floor(Math.random() * $sibs.length );
// var $next = $( $sibs[ rndNum ] );
$active.addClass('last-active');
$next.css({opacity: 0.0})
.addClass('active')
.animate({opacity: 1.0}, 1000, function() {
$active.removeClass('active last-active');
});
}
$(function() {
setInterval( "slideSwitch()", 4000 );//speed of changing image
});
Hello kind folk of codingforums.com! I am pretty new to JS and have been racking my brain all week to find a solution for this. I have a javascript fading slideshow but it has no back or next button. I'm not sure if i need to add another function or go about it a different way. Here is the code if anyone can help. Thanks in advance!!! <script type="text/javascript"> var slidespeed=5800 var slideimages=new Array("my_images/SBDCslide.gif","my_images/americanbuilding.gif","my_images/emerald.gif", "my_images/nautical.gif", "my_images/rent.gif","my_images/allyn.gif","my_images/SBDCslide.gif","my_images/signs.gif","my_images/cobalt.gif","my_images/test.gif","my_images/federal.gif") var slidelinks=new Array("#" ,"american.asp","emerald.asp","nautical.asp") var whichlink=0 var whichimage=0 var imgobj, filtersupport, blenddelay var imageholder=new Array() for (i=0;i<slideimages.length;i++){ //preload images imageholder[i]=new Image() imageholder[i].src=slideimages[i] } function gotoshow(){ window.location=slidelinks[whichlink] } function slideit(){ if (filtersupport) imgobj.filters[0].apply() imgobj.src=imageholder[whichimage].src if (filtersupport) imgobj.filters[0].play() whichlink=whichimage whichimage=(whichimage<slideimages.length-1)? whichimage+1 : 0 setTimeout("slideit()", slidespeed+blenddelay) } window.onload=function(){ imgobj=document.getElementById("slideshow") //access img obj filtersupport=imgobj.filters //check for support for filters blenddelay=(filtersupport)? imgobj.filters[0].duration*1000 : 0 slideit() } </script> Been given a task to edit a simple javascript slide show to have form buttons This what i have so far.. I have the next and back buttons working but i have no idea where to begin with play and stop. It should basically repeatedtly cycle. Quote: <script type="text/javascript"> var hol_pics = new Array(); // Create Array Object for (var i=0;i<9;i=i+1) { hol_pics[i]=new Image(); // Make 0 -> 8 array elements into Image Objects hol_pics[i].src="harbour"+i+".jpg"; // Preload Images } i=0; // 'Remember' original image displayed by img tag function next_photo() { i=i+1; if(i>8) i=0; // Increment image index but keep in range 0 - 8 // above 2 lines can be replaced by alternative code: i=(i+1)%9; document.images[0].src = hol_pics[i].src; // Display next image } function back_photo() { i=i-1; if(i<0) i=8; // Decrement image index but keep in range 0 - 8 // above 2 lines can be replaced by alternative code: i=(i-1+9)%9; document.images[0].src = hol_pics[i].src; // Display next image } //]]> </script> </head> <body> <h1>Basic Slide Show</h1> <p> <img src="harbour0.jpg" width="324" height="432" alt=></a> <form action=""> <input type="button" value="Previous" name="button" onclick="back_photo()" /> <input type="button" value="Next" name="button" onclick="next_photo()" /> </form> See slideshow at URL: http://backstageweb.net/1012Locust/ I want these slides to advance manually (on click only), not advance automatically. There are only two sample slides here. Click the play button to advance to Slide 2 (end of show). On Slide 2, it does not advance automatically. However, click the play button again (back to Slide 1, beginning of show). At this point, it automatically advances to Slide 2. Can someone please tell me how to get the slides to advance OnClick only? Thanks, John NOT SURE WHAT IS GOING ON, WHEN I COMMENT OUT THE CREATE ARRAY FUNCTION EVERYTHING SEEMS TO WORK FINE, SO WHAT IS UP WITH THE CREATEARRAY FUNCTION???? Code: <!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" lang="en" xml:lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
<title>Photoviewer</title>
</head>
<body bgcolor="#FFF1CC">
<h1><u> Viewer </u></h1>
<p>
<img id="myImage" src="InitialImage.jpg" width="444" height="293" alt="viewerImg" />
</p>
<hr />
<!--Entry boxes-->
<form action="" method="post">
<p>Photo's Folder
<input type="text" id="photofold" value="umcp/" /><br />
</p>
<p>Common Name
<input type="text" id="commonName" value="college" /><br />
</p>
<p> Start Photo Number
<input type="text" id="Startval" value="1" />
</p>
<p>End Photo Number
<input type="text" id="Endval" value="1" />
</p>
<!--Action buttons-->
<p>
<input type="button"id="displayShowButton" value="Slide Show" />
<input type="button"id="displayRandoButton" value="Random Slide Show" />
<input type="button"id="displayNextButton" value="Previous Slide" />
<input type="button"id="displayLastButton" value="Next Slide" />
</p>
<!--Reset Button-->
<p>
<input type="reset" value="Reset" />
</p>
</form>
<script type="text/javascript">
/*<![CDATA[*/
/*setting global variables*/
var photosArrayGlobal;
var photoIndexGlobal;
var displayGlobal=document.getElementById("myImage")
/* calling main */
main();
function main() {
document.getElementById("displayShowButton").onclick= setSequential;
document.getElementById("displayRandoButton").onclick=setRandom;
}
/*Generate the size of the photoarrays */
function createArray() {
window.alert("create array");
if (number > 0) {
window.alert("there are"+number+"photos in your range");
photosArrayGlobal= new Array (number);
return photoArrayGlobal;
getArrayPhotosNames();
}
Else {
window.alert("there is one photo in your range");
photosArrayGlobal = new Array (1);
return photosArrayGlobal;
getArrayPhotosNames();
}
}
/*Designate that either a random or a sequential order has been requested,sequential=1/random=0*/
function setSequential() {
var mode= 1;
window.alert("set sequential");
checkRange();
}
function setRandom () {
var mode= 0;
window.alert("set random");
checkRange ();
}
/*make sure end is start is less than end*/
function checkRange() {
window.alert("check range");
var Start= document.getElementById("Startval");
var Startnum = Start.value;
var End = document.getElementById("Endval");
var Endnum = End.value
if (Endnum < Startnum){
window.alert("Invalid Numbers");
}
else {
window.alert("correct input");
var range = Endnum - Startnum;
window.alert(range);
var number=Number(range);
createArray ();
}
}
/* This function will read the folder name, common name, start photo number, and end photo number and will return an array with the names of the photos that belong to the specified number range. Each photo's name consists of the folder name, followed by the common name, the photo's number and the ".jpg" extension*/
function getArrayPhotosNames () {
window.alert("all done for now");
}
/*]]>*/
</script>
</body>
</html>
I've just started to learn Javascript at college, and I made a little code that traps people in a dialogue box loop. var escape = 0 for(escape === 0; escape <= 1 confirm("Going somewhere?") I want to know if there is a site, or a possibility I can start this code, simple by sending friends a URL they can click on. For completely innocent purposes, of course. Thanks! Hi everyone. I'm trying to figure out how to make it so that when someone enters a number in the first textbox to start counting from and then they enter a second number where to stop counting. then the user must enter a number to step up/down by when counting.. there are 3 textboxes, one for start, one for end and one for the step up/down. When the user pushes the button the page clears and then the numbers will show.. If they use the same starting and ending number they have to be alerted that it is not valid. The user can enter a starting number bigger than the ending number. Take into account that a user might enter a positive or negative step value any tips or guidance for this is very appreciated Hey guys I've a download page with a button 'DOWNLOAD NOW'. When the button is clicked visitors will have to wait for the download to starts (doesn't redirect). What I want is that sometimes it takes very long for the DL to start after clicking the button, for instance 10 seconds. Hence I want to show a simple preloader WHEN the button is click, while waiting for the browser to stop loading and download to start, AND hide the preloader when browser stop loading and download started. Internet Explorer requires the user to click on an applet to activate it, which means two clicks if there is a start button, for example. I previously learned a workaround, which is to activate the applet from an external Javascript, something like this: Code: document.write('<applet code="' + appletname + '" width="' + w + '" height="' + h + '"></applet>');
This doesn't work in IE8. Is there a workaround for IE8? Thanks. 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,"");
}
}
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 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. Hi I am using back button with javascript:history.back(); on it but the page I want to go back have anchor link smth like: http://example.com/index.php#anchor_link How do I go back ? I've tried javascript.history.go(-1); a 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 ! Hi, Pretty simple problem I hope Ive somehow changed something in my coding on my html page to stop the slide show working correctly. Any ideas heres the link: http://sparekeys.org.uk/ Please help i know its something stupid but I just cant see it. |
|||||||