|
JavaScript - Function To Call 4 Sets Of Images.
I am trying to create a function that could fill an area with 4 sets of images.
So you could click a button (one of 4) and that would fill the area underneath with images. Then when you click the next button (which is side by side with the first and the other buttons) it toggles the first set of images off and toggles on the second set. I'm new to js and don't know the names of statements or how to have images in an array that i can toggle. Similar TutorialsHey everyone! I'm in the process of creating a portfolio site for my artwork and I'm requesting help. The website has a scalable JQuery background which changes depending on which thumbnail you click. I've uploaded the progress he http://www.aldousmassie.com/newprogress I'm using this code at the moment to scroll through the background: Code: <!-- SCRIPT FOR CHANGING BG ON CLICK -->
<script type="text/javascript">
imgs=Array("img/00.jpg","img/01.jpg","img/02.jpg","img/03.jpg");
var x=0;
function change() {
document.getElementById("bgimg").src=imgs[++x];
if (x==3) {
x=-1;
}
}
if (!imgs[x+1]) {
x=-1;
}
</script>
<!-- SCRIPT BELOW OVERWRITES SCRIPT ABOVE -->
<script type="text/javascript">
imgs=Array("img/08.jpg","img/09.jpg","img/10.jpg","img/11.jpg","img/12.jpg","img/13.jpg");
var x=0;
function change() {
document.getElementById("bgimg").src=imgs[++x];
if (x==5) {
x=-1;
}
}
if (!imgs[x+1]) {
x=-1;
}
</script>
Unfortunately, the bottom code overwrites the top. Is it possible for each different background image to have their own "set" of images that could be scrolled through onclick? I'd appreciate any tips that point me in the right direction. Thank you. hello, can anyone suggest a solution to get the following: there are 3 folders each containing own set of images. clicking on the button you get a random combination of 3 images, each coming from different folder. that wont be a problem to find a javascript using xml list of images. but if I'm going to add some images later, php will be the better solution, if i don't want to update xml each time. there are plenty of examples using pure php to get and random images as well. but i need php solely to check all three folders on page load, grab them in three arrays an pass these 3 arrays to javascript, so it can random them on demand. i wonder if there is a simple solution for that, that would be understandable for a beginner in js and php? thanx, Hi, I am hoping I just need to be pointed in the right direction with this. I have Page1. When Page1 body onloads it uses Ajax to call PartA Within PartA I have a message board so members can write messages which will be sent to my database in PartA[1] and immediately posted for view on to PartA[2]. As I want to have my request to the server updating regularly I want to have PartA[2] on a timed loop to refresh - I do not need the content of PartA[1] to refresh. So the order of events would look like this: Page1 | onload call | v PartA / \ V V PartA[1] PartA[2] (loads once) (constantly refreshes) What I am not sure about is that I have <body> and <head> attributes in Page1 only. I have already used my body onload to call PartA (and can't use it to call PartA[2] before PartA has loaded anyway). I do not want the user to have to click a button or do anything to call up PartA[2]. So my question is how would I get PartA[2] to automatically load within PartA? I hope I have made this clear, but if I haven't let me know and I will try again. <p> <script type="text/javascript">// <![CDATA[ var metrics = { "mm" : 1, "cm" : 10, "m" : 1000, "inch" : 25.4, "foot" : 304.8 }; function convert(num, dec){ var val = document.getElementById("fromVal").value; if(isNaN(val)){ return } function roundNumber(num, dec) { var result = Math.round( Math.round( num * Math.pow( 10, dec + 1 ) ) / Math.pow( 10, 1 ) ) / Math.pow(10,dec); return result; } document.getElementById("toVal").value = val * metrics[document.getElementById("fromSystem").value]/ metrics[document.getElementById("toSystem").value]; } var interval = null; function watchChanges(){ interval == null ? setInterval("convert()", 500) : clearInterval(interval); } // ]]></script> </p> <table> <tbody> <tr> <td><input id="fromVal" style="width: 100px;" onfocus="watchChanges()" onblur="watchChanges()" type="text" /><select id="fromSystem" onchange="convert()"> <option value="mm">millimeters</option> <option selected="selected" value="cm">centimeters</option> <option value="m">meters</option> <option value="foot">feet</option> <option value="inch">inches</option> </select></td> </tr> <tr> <td colspan="1" align="center">=</td> </tr> <tr> <td><input id="toVal" style="width: 100px;" type="text" disabled="disabled" /><select id="toSystem" onchange="convert()"> <option value="mm">millimeters</option> <option value="cm">centimeters</option> <option value="m">meters</option> <option selected="selected" value="foot">feet</option> <option value="inch">inches</option> </select></td> i keep getting error Call to undefined function codeandurl() below is my code PHP Code: <?php $value= strip_tags(get_field('link',$post)); $resultid=get_field('resultid',$post); codeandurl($resultid,$value); ?> <div id="result"></div> <script type="text/javascript"> function codeandurl(resultid,url){ $( "#result" ).text(resultid); $( "#result" ).dialog({ modal: true, buttons: { Ok: function() { $( this ).dialog( "close" ); } } }); window.open(url); return false; } </script> I'm trying to "progressively enhance" one of my surveys using javascript. Basically, I have rating scales that make use of radio buttons as each point on the scale. Each radio button occupies its own cell in a table. I wrote some functions that will highlight cells on mouseover in a color corresponding to its position on the scale (e.g. the lowest point is red, the midpoint is yellow, the highest point is green). When a radio button is clicked, the background of the button's cell and preceding cells in the same row will be colored accordingly. The functions are working well in FireFox and Chrome (I just have to add a few lines using the addEvent function to make it compatible with IE). The effect looks a lot nicer when I add a function that makes the visibility of the radio buttons hidden. However, I want to make sure that there is a fallback option in case the functions that color the cells don't work for whatever reason. I would not want the radio buttons hidden in this case. Is there a method whereby I can call the "hideRadiobuttons" function only if the other functions are successfully executed? Code: <html>
<head>
<title>TESTING</title>
<script type="text/javascript">
<!--
document.write("<input type='submit' value='submit' onclick='func()'>");
function func()
{
document.write("<input type='submit' value='New Button' onclick='func()'>");
window.alert("THIS");
}
-->
</script>
</head>
<body>
<!--input type="button" value="Read" onclick="ReadFiles()"-->
</body>
</html>
This is a very basic version of what I am trying to do. I have a dynamic list which is set in a table. When clicked, a function is run to set up a new list.. The reason I explain that, is that I need to keep it dynamic. Now for the problem: When I run this page, I have the button made right away, then when clicked it creates the new button. The new button should also run the function to create the new button again, but when I click it, I only receive "error on page". I don't know if there is a better way to go about this, but as for this route, I am stuck. Any help is greatly appreciated! -Shane My problem is that I am trying to call an function within an SWF. Now, I already know how to setup my SWF and that isn't the problem. The problem is that when I try to call the function using Javascript, I am told that the function doesn't exist. I'll show you the code right here. Code: function AudioPlayerEmbed( e )
{
if ( e.success )
{
e.ref.LoadAudio( 'http://therevolve.com/upload/userfiles/Music/Alec_Smith1.mp3' );
}
}
swfobject.embedSWF("player/MP3Player.swf", "flash", "300", "90", "9.0.0", "player/expressInstall.swf", null, null, null, AudioPlayerEmbed );
HOWEVER, when I put some alert before the call, it happens to work. What is going on? Code: function AudioPlayerEmbed( e )
{
alert("A");
if ( e.success )
{
e.ref.LoadAudio( 'http://therevolve.com/upload/userfiles/Music/Alec_Smith1.mp3' );
}
}
swfobject.embedSWF("player/MP3Player.swf", "flash", "300", "90", "9.0.0", "player/expressInstall.swf", null, null, null, AudioPlayerEmbed );
Here is a live example. Any help would be appreciated. If you need more information, I can provide it. Hello, if in a webpage is included a javascript file (for example code.js) can I from my browser call a function contained in code.js and will it works correctly? I'm not meaning that the function is called in the page with or without a link to click, but it is only in code.js! Thank you! I'm trying to implement this 'ajax' script, however i'm getting the following error: function expected line 25. And I'm not the only person who is getting this error message :S How can the code be altered so it will work? Also the script isn't executed when I change onclick in onload :S How come and how can I change it so that it will be executed on launch? http://chriscook.me/web-development/...icking-a-link/ Hello. Started my massive JavaScript career just yesterday and the forums I frequent still lack a proper BB-code hide-tag, so I figured I'd try make it in JavaScript, since HTML is allowed on there. This is what I did: Code: <script type="text/javascript">
function show() {
document.getElementById('silHideTextTag').innerHTML='Hidden text!!';
document.getElementById('silHideTextBtn').value='Hide';
document.getElementById('silHideTextBtn').onclick='hide()';
}
function hide() {
document.getElementById('silHideTextTag').innerHTML=' ';
document.getElementById('silHideTextBtn').value='Show';
document.getElementById('silHideTextBtn').onclick='show()';
}
</script>
<input type='button' id='silHideTextBtn' onclick='show()' value='Show'/>
<div id='silHideTextTag'> </div>
The button labelled "Show" appears fine, when I click it it becomes "Hide" and the text "Hidden text!!" is shown. However, when I click the button again, nothing happens at all. I don't quite understand where the problem is. Thanks in advance for any clues. Best regards, Zyl i have been trying all sorts of things, but falling short... i'm trying to set up a way to detect a user's browser size and then call a specific background image accordingly... say (for example) that BKGD1.jpg is for users who have browsers that are 1280x1024 and higher; BKGD2.jpg is for users who have browsers that are smaller than 1280x1024... i'm even open to an option that only displays a background image if the browser is (as in the example above) 1280x1024, and just a background color if the browser is smaller than that... i don't know... i am totally lost on this one... any help would be amazing!!! thank you... The Javascript function change() in not getting called by onClick event of button Click Me ,JavaScript array size has been created in PHP Code: <html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script type="text/javascript" language="javascript">
function change()
{
alert(size[1][0]);
}
</script>
</head>
<body>
<script language="javascript">
var size = new Array();
var = count;
for (count = 0; count < 5; count++)
size[count] = new Array();
size[0][0] = 600;
size[0][1] = 400;
size[1][0] = 300;
size[1][1] = 400;
size[2][0] = 300;
size[2][1] = 400;
size[3][0] = 600;
size[3][1] = 400;
size[4][0] = 300;
size[4][1] = 400;
</script>
<input type="button" value="Click Me" onClick="change()"/>
</body>
</html>
Anything wrong with my coding,any kind support will be apreciated. Thanks, Srinivas. I am trying to make an onblur that calls a function and passes it some text, for example: onblur = "function("Hello")" however this wont work as it is not even calling the function. I have tried all the different encapsulation tags I can think of but still no luck is there any way of doing it or can I assign the text to a variable and call the function in the onblur? Thanks.:confused: <frameset rows="30%,70%> <frame src="page1.html" name="name1" frameborder="0"></frame> <frame src="page2.html" name="name2" frameborder="0"></frame> </frameset> in above code I used page1.html & page2.html as frame. Both include same javascript file having two function name fun1() & fun2(). as both are separate frame both have there own copy function page1.html fun1() fun2() page2.html fun1() fun2() I call fun2() from page2.html and inside that function I want to call page1.html's fun1(). fun1() in page1.html and fun1() in page2.html both return different result because of there global variables. Is there any way to call fun1()-page1.html from the fun2()-page2.html? HI I have tow page and the first page open a new window with javascript(by using window.open).Now I want to call a javascript function that is in the first page from the second page and for that i use parent.function_name but it doesn't work.How can do so? thanks Hi, The Problem I get a error message only in IE when ever I try to call a function from an external file. I am using jQuery if that makes any difference and various plugins. Quote: Error: The value of the property '<function name>' is null or undefined, not a Function object. All the call work fine in FF, chrome, safari etc but for some reason I just can't get it to work with IE. This is getting annoying now, i have no idea what is causing it. here is an example: admin.js Code: function create_cleditor_admin_form(textarea_object)
{
$(textarea_object).cleditor({
height: 120,
controls: // controls to add to the toolbar
"bold italic underline | color highlight removeformat | bullets numbering | alignleft center alignright justify | undo redo | ",
useCSS: false
});
}
calling code Code: $(document).ready(function() {
try {
create_cleditor_admin_form('textarea');
} catch(e) {
alert("Error: "+e.message);
}
});
I have tried searching for this error on google and came up empty handed, surely it just something very stupid. Thanks in advance I am relatively new to JavaScript so am still learning. I have a page I would like to call a function when it loads but not sure how to do this. The function is http://tickettransaction.com/?bid=20...ults&venid=101 and should function similar to this page when loads http://paviliondallas.com/ I could get that with html but not sure how to auto load to render ths list from the provided plugin. Another example is http://www.justbuytickets.com/Venues...FcY32godDU-hzw Any help would be appreciated. Thanks in advance. [delete]
|
|||||||