JavaScript - Zooming In Script On Button Press

Hello everybody,

I need to write a javascript program that shows a map (.png image) on the web, and when the mouse moves over the map, it zooms the area around the pointer. (the zoomed part comes from a high resolution large image which actually should be cropped in order not to be larger than certain size.)

I am a newbie in javascipt, and I have learned some, but still I have no idea how to create a such script. Do I need something extra like CSS, JQuery? I have no experience in web programming, so any help would be much appreciated.

Hi all,

I have a map of a topographical area divided into districts. On mouseover i'd like the district to light up en when pressing a mousebutton I would like to zoom in, showing only that district... which is divided into teams.

Is that possible with JavaScript? Are there example-script for this purpose?

Hope someone can help.

Nop01

I want to create something similar to what they achieve with this script: http://www.magictoolbox.com/magiczoom/

I know I could just download their script, but it's for a website that will be commercial in nature, and my cousin doesn't want to pay 29 pounds (which is a lot in AUD!) for it.

I can use a rollover to display a larger image next to it, but I'm not sure on how to make the image move like that one does.

Any help or suggetions would be greatly appreciated! Originally she just wanted something like the Lightbox script, so it's annoying her changing her mind now!

Hello, I'm working on a small project and I'm new to javascript, basically on my canvas I have drawn a fault tree diagram that look like this View image: zoomzoom, what I want is too zoom in/out using the mouse wheel, and use mouse button to pan it to left/right. Don't really know where to stand so any advice would be helpful.

I want to detect the double-press of the space key. However, I want a single press of a space key to have a different function. The double-tap of space should only count if the taps of space are no more than, say, a half second apart.

For example:
The user hits space once, and javascript begins performing one action. 1/3rd of a second later, they hit the space bar again, and since that is within our threshold of 1/2 of a second, the action that began because the user hit the spacebar once should be cancelled, or undone (which I can write later) and the action when the user hits the spacebar twice should begin.

Anyone have an idea how to do this? Thanks!

Hi,

Hi, I want to simulate user KEY PRESS (not mouse clicking) automatically on a screen every time that a pop up window (script error message) is opened on the screen OR detecting when an an iframe gets focus.

My goal: Automatically closes the pop up window.

If anybody know the exact code please post it.

FG

Hi all, just before i kick off im not looking for the code just a push in the right direction.

I am using a wysiwyg editor (tiny mce) which is basicaly a textarea with content in it.

What i am looking to do is when a presses enter withing the textarea a <br/> tag is placed where the text curser is.


Code:

<textarea>
<p>dfsdfdfdfdfdf dsfsdfdf dsfdsfdsf dsfdsfds dsfdfdss [enterpressed]<br/>
dffdsf dfs dsfd sdf sdfs fdsf</p>
</textarea>

secondly, if a user users the arrow keys to navigate where to edit, when they get to the begining or the end of a tag, i want the arrows to be disabled.


Code:

<textarea>
<p>||<df<sdf<dfd<fdfdf dsfsdfdf dsfdsfdsf dsfdsfds dsfdfdss [enterpressed]<br/>
dffdsf> dfs> dsfd s>df sdfs>> fds>f||</p>
</textarea>

(<> represents arrow press, || represents blocked, and can go no further)

any help much appreciated.

I wanted to make it so that a button on the webpage validates a word that a user types into a prompt box that pops up when they open the webpage.

For example, user goes on website, prompt box opens, user types in word then presses OK. On the webpage he clicks the button, which calls a while function to check if the word has a P at the start, a J somewhere in it, and is longer than 8 characters.

Code:

<script type="text/javascript">

	var strWord;

	function validateWord() 
	{
	while(strWord == document.formname.validateWord.value.length > 8 &&  var iChars =
"JP";)
	{ 
	"alert(Correct)" 
	value="Word Alert">
	}

	}


</SCRIPT>

I've been trying this script but with no luck and cant tell whats wrong with it. Any ideas?

Hi Guys,

I was wondering if I could have some help. Its coding for the left side of a frame set to display in the right side. Im pulling my hair out! Thanks
Code:

<html>
<head>


 <script type="text/javascript">
  function go()
  {
    var go="none";
    if (document.buttons.option[0].checked)
    go=button.option[0].value;
    if (document.buttons.option[1].checked)
    go=buttons.option[1].value;
    if (document.buttons.option[2].checked)
    go=buttons.option[2].value;

    parent.rightframe.location=go;

  }
 </script>
</head>

<body>
<form name="buttons" id="buttons">
<input type="radio" name="option" value="cit.html" checked="checked">CIT</input>
<br />
<input type="radio" name="option" value="currency.html">Currency</input>
<br />
<input type="radio" name="option" value="staffsurvey.html">Staff Survey</input>
<br />
<input type="radio" name="option" value="game.html">Game</input>
<br />
<input type="button" value="Go" onClick="go();"</input>
</form>

</body>
</html>

Hello,

I am trying to have my print button appear only once the script for my validation button has gone through without any errors. To do this, I used the following script in my validation button (I've truncated most of it since you get the point after two lines):

// hidden field
var lrcf = this.getField("LastRCFalse");

var ei = this.getField("Employee ID number");

if ( lrcf.value != ""){
var tempname = lrcf.value;
if (tempname == "Employee ID number")
{ei.setFocus();}}
else {
var ei = this.getField("Employee ID number");
if (ei.value != "" && (ei.value == "0000000" || ei.value < 1259)){
app.alert("Employee ID number, if entered, must be between 0001259 and 0999999")
ei.setFocus();}

else {
var city = this.getField("Effective date");
if (city.value == ""){
app.alert("Please enter Effective date")
city.setFocus();}
else {
var gmf = this.getField("Gender");
if (gmf.value != "M" && gmf.value != "F" ){
app.alert("Please select gender of employee")
gmf.setFocus();}

else {

// Making fields visible for printing
VisibleToPrint();
app.alert("Your form is ready to print. Please press the PRINT button on this form.",3)

The red part is where it all seems to be breaking apart. I've verified that none of the script before is incorrect and it all goes smoothly except that my print button does not appear afterwards. (The print button doesn't have any complicated script just a "execute a menu item" and is put as hidden in common properties so that no one can print before having gone through the verification).

Should I have created another print button which sits on top of the other one?

I am really new to this so any help would be greatly appreciated.

Hi Everyone,

I want to execute a script when the user clicks the button.

Currently in my html doc. i have the button declared.
<input type="button" id ="button" onclick='notEmpty() value="Play"/>

When the button is clicked, i execute the notEmpty() function and I want to execute a script inside the notEmpty(). How can i do this?

Thanks,
Praveen

I have the following code:

Quote:
<form id="registration" action="/cgi-bin/registration.cgi" method="POST" onsubmit="return control()">
<fieldset>
<legend>Fill up this module</legend>
Private <input id="private" type="radio" name="type" value="private" onclick="return addPrivate()"/><br/>
Community/Organization <input id="organization" type="radio" name="type" onclick="alert('Organization')"/><br/>
<br/>

and the following script:

Quote:
addPrivate() {
alert('Private');
}
but alert windows doesn't not appear.
Where is the problem?

I am a new to js and GM but I am trying to make a script that will click a button on a page where there are multiple instances of the button.

The source I am looking at is below and I have narrowed down what I am looking at to the bold section.

<dl>
<dd class="left"><div id='recommendstatus_article4458331'>
<dl class="recommend">
<dt class='recs'><a href="javascript://" onclick="RecSpy( 'article', '4458331', 'tippers' ); return false;">50</a>&nbsp;</dt>

<dd><a href="javascript:void(0);"
onclick="RecommendItem(1,'article','4458331','1','recommendstatus_article4458331' ); return false;"
onmouseover="return overlib('Give thumbs up', WRAP);"
onmouseout="return nd();">&nbsp;<img class='icon' title='' alt='Thumb up' style='background-position: -304px -48px;' src='http://geekdo-images.com/images/pixel.gif' /></a></dd>
<dt class='tippers'><a href="javascript://" style='color: #969600;' onclick="RecSpy( 'article', '4458331', 'tippers' ); return false;"></a></dt>
<dd><a href="javascript:void(0);"
onmouseover = "return overlib( 'GeekGold Tip', WRAP );"
onmouseout = "nd();"
onClick="GeekGoldTip(0,'article','4458331','recommendstatus_article4458331'); return false;">&nbsp;<img class='icon' title='' alt='tip' style='background-position: -368px -48px;' src='http://geekdo-images.com/images/pixel.gif' /></a></dd>
<dd>
<a href="javascript:void(0);"
onclick="RecommendItem(0,'article','4458331','','recommendstatus_article4458331', 'article4458331' ); return false;"
onmouseover="return overlib('Hide this post', WRAP);"
onmouseout="return nd();">&nbsp;<img class='icon' title='' alt='Thumb up' style='background-position: -336px -48px;' src='http://geekdo-images.com/images/pixel.gif' /></a>
</dd>
<dt class='thumbsdown'>
</dt>
</dl>

How do I create a script to find each instance of the button and click it?

http://vietnamthereandback.com/mainpage.html

The arrows next to the songs previews are randomly appearing/disappearing on page refresh. There are always 8 arrows, but each refresh shows the arrows in different places. This has really got me stumped. If anyone has any thoughts, I'd really appreciate hearing them. The basic button/arrow code is below. The only thing that changes in the MP3 file name.

<code>

<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=10,0,0,0" width="30" height="30">

<PARAM NAME=movie VALUE="http://www.vietnamthereandback.com/Clips/audioplay.swf?file=http://www.vietnamthereandback.com/Clips/reflections.mp3&auto=no&sendstop=yes&repeat=1&buttondir=http://www.vietnamthereandback.com/Clips/buttons/negative_small&bgcolor=0xffffff&mode=playpause">

<PARAM NAME=quality VALUE=high>
<PARAM NAME=wmode VALUE=transparent>
<embed src="http://www.vietnamthereandback.com/Clips/audioplay.swf?file=http://www.vietnamthereandback.com/Clips/reflections.mp3&auto=no&sendstop=yes&repeat=1&buttondir=http://www.vietnamthereandback.com/Clips/buttons/negative_small&bgcolor=0xffffff&mode=playpause" quality=high wmode=transparent width="30" height="30" align="" TYPE="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer"></embed></object>

</code>

Hi all,

I would like to have an HTML button which, when clicked by the user, contacts the server and runs a Python script on the server. When the Python script finishes running, the current HTML page automatically reloads a file from the server.

Is that possible?

YJ