JavaScript - Hide And Move News With Mouse Click

Hey guys!
How can i simulate a click event?

Like a real mouse click.
and a keyboard click event?

I've spent days searching without luck.
I need help with the following:

I have a program that have some hotkeys set to trigger some events. I would like to activate those hotkeys from inside firefox by clicking on a button. I'm not looking for keypress events, it has to be a button click.
So, let's say I click on the button that executes a javascript code that emulates F7 or CTRL+A or whatever key or key combination. Can you guys please help with to find a solution?
Oh, and I need it to work with Firefox only.

Thanks!

hi, on my site, http://www.jbiddulph.com/john-drag.html when i move the box within the box, the results are only shown when I click on the firebug icon?!

Can someone please help me here? I would like the results to be shown OnMouseUP

thanks

I have small webBrowser1 and I have the 3 Buttons(Back, Forward,Go) also I have the ComboBox1 with the Items Collection of different website url
using MSVB 2008 in C++
My question:
1) How could I make my mouse click on each url with timer between the first url and the second and so on and let's say time between the 1st url and scroll down to the second with timer of 3 second .
2) How to make also the mouse click on certain button on that website what is the command code for that.
I Thank you for any help.

hello!

I currently have 2 UL's that get slide down when you click a button (used for navigation). I currently have it set up so that when you click the "ul#selectService" they slide down, and when you click it a second time it will slide back up and disappear. However, they only way to get the UL's to disappear is to click the "ul#selectService" a second time, so I'm trying to get it set up so that when you click on anything that isn't the UL's it will cause it to slide back up again.

i currently have been working on a starting idea to show what I'm basically trying to do so that you can get a rough estimate of my goal:

This is my HTML that i'm using:
Code:

<ul id="selectService">
    <li></li>
    <li></li>
    <li></li>
</ul>
<ul id="secondHalf">
    <li></li>
    <li></li>
    <li></li>
</ul>

Code:

var $box = $('#selectService');
$("*:not(#serviceSelect)").click(function(){
	if (!$box.has(this).length) { // if the click was not within $box
		$('#selectService').hide();
		$('#secondHalf).hide();
	}
});

Right now nothing is happening when i click out of the UL any thoughts?

Hey. I've got some code that shows a div if a link is clicked. How can I add to the code so when it's clicked again, it hides it. Here's my code (the .linkon class needs to be removed again after as well):

Code:

<style type="text/css">
.linkoff-div .linkon {
	color:orange;
	font-size:15px;
	font-weight: bold;
}
.linkoff-div {
	text-align: left;
	line-height: 20px;
        border-bottom: 2px solid #344050;
        margin-top: 15px;
}
.linkoff-div a {
	color:white;
	font-size: 15px;
}
#faq1 {
        background-color: #596778;
        width: 540px;
        padding: 5px;
}
</style>

<script type="text/javascript">
function hideall(){
	document.getElementById("faq1").style.display="none";
	document.getElementById("faq2").style.display="none";
	document.getElementById("faq3").style.display="none";
	document.getElementById("faq4").style.display="none";
	document.getElementById("link1").className="linkoff";
	document.getElementById("link2").className="linkoff";
	document.getElementById("link3").className="linkoff";
	document.getElementById("link4").className="linkoff";
}

function myclick(id){
	hideall();
	document.getElementById("faq" + id).style.display="block";
	document.getElementById("link" + id).className="linkon";
}
</script>

	<div class="linkoff-div"><a href='#' id="link1" onclick="myclick(1);return false;" class="linkoff">Registration</a></div>
		<div id="faq1" style="display:none">
			Registration stuff
		</div>

	<div class="linkoff-div"><a href='#' id="link2" onclick="myclick(2);return false;" class="linkoff">Logging In</a></div>
		<div id="faq2" style="display:none">
			Logging in stuff
		</div>

	<div class="linkoff-div"><a href='#' id="link3" onclick="myclick(3);return false;" class="linkoff">My Account</a></div>
		<div id="faq3" style="display:none">
			My Acccount stuff
		</div>
 
	<div class="linkoff-div"><a href='#' id="link4" onclick="myclick(3);return false;" class="linkoff">Videos</a></div>
		<div id="faq4" style="display:none">
			Video stuff
		</div>

Thanks,
Adam

Hi Im trying to make a dropdown menu like IGN has on his site with the following javascript code.
The only problem however is I can't seem to hide the menu when a user clicks outside the menu.
This is a bit frustrated because when a user wants to hide the menu again the need to reclick the menu header.

Is there anyway I could solve this problem? Also a explanation about the code would be helpfull im not used to work with javascript.

Also this is the code I have so far which works to onclick hide and show the menu.

javascript:
PHP Code:
function toggle(id) {
    var el = document.getElementById(id);
    if ( el.style.display != 'none' ) {
        el.style.display = 'none';
    }
    else {
        el.style.display = '';
    } 


HTML:
PHP Code:
<a href="#top" onclick="toggle('view_user-options');";>Panel</a>
<div id="view_user-options" style="display:none;">
 <div class="nav_option"><a href="">my test</a></div>
</div> 


Also if anyone knows how to do it plz combine it with my code so it works.
I always get in trouble with javascript when combining two codes in one.

Note: plz don't give me solution with tons of code I just want a verry simple solution.

http://www.codingcereal.com/2010/12/...-tab-switcher/

when i change the js code to this:
Code:

j Code:

Query(document).ready(function() {
        jQuery("#tabswitch ul li:first").addClass("active");
        jQuery("#tabswitch div.tab-container:first").show();

        jQuery("#tabswitch ul li").click(function(){
            jQuery("#tabswitch div.tab-container").hide();
            jQuery("#tabswitch ul li").removeClass("active");

   });
    })

for the default state. the tab1 is show, but why when i click the tab1. it doesn't hide?. but there is a line in the click function. jQuery("#tabswitch div.tab-container").hide();

could it be that this line doesn't effect on it? jQuery("#tabswitch div.tab-container").hide();

hi all.

i'm still newbie with programming.

i have created a table with two columns with a list of scholarship and a read more link. this is the table that i made:



what i want to do is to hide the second column if the user click the "read more" in first column and hide the first column when the user click the "read more" in second column.

if the user click "read less" it will show both column back like normal.

i try to use the javascript for hide column but it cannot link with my "read more" script.

i hope that anyone can help me. thanks in advance

Hi

well my problem is..

how do i hide the popup list.. i would like to if the user click outside of that div element.. the popup div will hide..

but whenever i select the body or the id containing that popup div.. the whenever i click the down arrow button.. it shows the popup div.. but then closes again.. because of the selector hide on the container div..

http://development.andrewfopalan.com/devpage/test.html

here's the test page..

when i click the down arrow.. it shoes the popup.. how to do if i want that any click outside that popup element.. i will call the hide/fadeout for the popup element..

please help.. tried various things.. just a shed of light will do..

thanks

Hi

i want to hide a table when user click on a link

this is my code looks like

PHP Code:
<div id="sh">
<table width="800" border="0">
  <tr>
    <td></td>
    <td></td>
    <td></td>
  </tr>
</table>
</div>

<div align="center"><a href="JavaScript:window.print();"><img src="images/print.png" alt="Print this page"/></a></div> 


is it possible to hide above table at same time print this link clicked?

any help would be great


sorry for language errors

Regards.

hello guys

im new in creating sites and i dont know anything about javascript so i creat a web page in frontpage 2003

wt i want to make there is..
the page is a downloading page.
so i want the vistor of this page to click the adv. first, then the download link will apear, only if he/she click on the adv.

here is the code of the page

Code:

<html>

<head>
<meta http-equiv="Content-Language" content="en-us">
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>Welcome to my site Download page</title>
</head>

<body>

<p align="center">&quot;Site logo&quot;</p>
<p align="center">Welcome to my site Download pages</p>
<p align="center">To be able to view the download link you have to open the 
following advertisement first.</p>
<p align="center">&nbsp;</p>
<p align="center">&nbsp;<!-- Begin: AdBrite, Generated: 2009-12-10 23:02:17  -->
<script type="text/javascript">
var AdBrite_Title_Color = '0000FF';
var AdBrite_Text_Color = '000000';
var AdBrite_Background_Color = 'FFFFFF';
var AdBrite_Border_Color = 'CCCCCC';
var AdBrite_URL_Color = '008000';
try{var AdBrite_Iframe=window.top!=window.self?2:1;var AdBrite_Referrer=document.referrer==''?document.location:document.referrer;AdBrite_Referrer=encodeURIComponent(AdBrite_Referrer);}catch(e){var AdBrite_Iframe='';var AdBrite_Referrer='';}
</script>
<span style="white-space:nowrap;"><script type="text/javascript">document.write(String.fromCharCode(60,83,67,82,73,80,84));document.write(' src="http://ads.adbrite.com/mb/text_group.php?sid=1435752&zs=3732385f3930&ifr='+AdBrite_Iframe+'&ref='+AdBrite_Referrer+'" type="text/javascript">');document.write(String.fromCharCode(60,47,83,67,82,73,80,84,62));</script>
<a target="_top" href="http://www.adbrite.com/mb/commerce/purchase_form.php?opid=1435752&afsid=1">
<img src="adbrite-your-ad-here-leaderboard.gif" style="background-color:#CCCCCC;border:none;padding:0;margin:0;" alt="Your Ad Here" width="14" height="90" border="0" /></a></span>
<!-- End: AdBrite --></p><hr>
<p align="center">&nbsp;</p>
<p align="center">Thank you</p>
<p align="center">
<a href="http://pearl.plunder.com/x/$kE_C_2YS2UAKXpp9SYAs5VA2mKS3AqHD/0fa75b6711/?/FarmVilleClicker.exe">
Click here to download the file.</a></p>

</body>

</html>

so this page is linked to my blog and the downloading webpage
im sorry for my bad english


any ideas.. ill be so thankful

Hi,

I am still designing the website and want some flexibility. I am capturing the mouse clicks fine on top of an image, but the coordinates are absolute and not relative to the image. How can I capture mouse clicks relative to the image so that I can move the image anywhere in my website?

Thanks!

Hi

I have created the following effects on the images seen here http://techavid.com/design/test3.html . You see when you hover and then click on each image, they go from grey to color. When you click on one - the others go grey and the one clicked remains color. That's cool, but now I need the text 1st: Sun for example to display and hide along with its graphic button. The word "Sun," is a link that needs to link out to a URL so it has to be separated from the image effect code.

Here code I have now....

Code:

<style type="text/css" media="screen">

#wrapper {
 background: url('_assets/images/sun-inactive.p') no-repeat #777eee;
  width: 470px;
  margin: 0 auto;
}

a#sun{
  background: url('_assets/images/sun-inactive.png') no-repeat;
  width: 107px;
  height: 78px;
  display:block;
  padding: 20px 10px;
  float: left;
  
}

a#sun:hover,
a#sun.active {
  background: url('_assets/images/sun.png') no-repeat;
  width: 107px;
  height: 78px;
  display:block;
  padding: 20px 10px;
}

a#plane {
  background: url('_assets/images/plane-inactive.png') no-repeat;
  width: 107px;
  height: 78px;
  display:block;
  padding: 20px 10px;
  float: left;
}

a#plane:hover,
a#plane.active {
  background: url('_assets/images/plane.png') no-repeat;
  width: 107px;
  height: 78px;
  display:block;
  padding: 20px 10px;
}

a#nano {
  background: url('_assets/images/nano-inactive.png') no-repeat;
  width: 107px;
  height: 78px;
  display:block;
  padding: 20px 10px;
  float: left;
}

a#nano:hover,
a#nano.active {
  background: url('_assets/images/nano.png') no-repeat;
  width: 107px;
  height: 78px;
  display:block;
  padding: 20px 10px;
}

#popuptext {
float: left;
margin: -30px 0 0 0;
padding: 0 0 0 0px;
font-size: 11px;
}

#popuptext a {
color: #ff6600;
padding: 0 30px; 
}




</style>


</head>
<body>

<div id="wrapper">
<div id="navigation">
  <a id="sun" href="#"></a>
  <a id="plane" href="#"></a>
  <a id="nano" href="#"></a>
</div>

<div style="clear:both"></div>
  <div id="popuptext">1st: <a href="#">Sun</a>
2nd: <a href="#">Airplane</a>
3rd: <a href="#">Nano</a> 

</div>

</div>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.1/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript" charset="utf-8">
$(document).ready(function() {

  // target each link in the navigation div
  $('#navigation a').click(function() {
    // link that you clicked
    clicked = $(this).attr('id');

    // make sure that all the others are not active
    // except for the clicked one
    $('#navigation a').each(function() {
      if ($(this).attr('id') == clicked) {
        $(this).addClass('active');
      } else {
        $(this).removeClass('active');
      }
    });

    // prevent the default link action
    return false;
  });

});
</script>

What jquery or javascript code do I need to do this?

thanks,
chaser

I've got to have a typo somewhere, but i can't seem to find it. I need a new pair of eyes to point it out for me.

background: trying to code a mouseover link for a nav bar. everything is working( hyperlink, normal image shows up) but when i mouse over the image swap doesn't happen.

I have 2 parts of code. 1st preloads images and does the swap function. loads in <head> See below:
Code:

<SCRIPT language="javascript" type="text/javascript">
if (document.images)
{
/* preload images */
	var subcontractorsOn = new Image ();
	subcontractorsOn.scr = "subcontractorsOn.gif";
	
 	var subcontractorsOff = new Image ();
	subcontractorsOff.scr = "subcontractorsOff.gif";
}
	function mouseOn (imgName)
	{
		if (document.images)
			document [imgName].scr = eval (imgName + "On.scr");
	}
	
	function mouseOff (imgName)
	{
		if (document.images)
			document [imgName].scr = eval (imgName + "Off.scr");
	}
	
</SCRIPT>

2nd just calls the functions to preform the swap. this is in the <body>
see code below
Code:

<a href="subcontractors.htm" onMouseOut="mouseOn('subcontractors')"
onMouseOver="mouseOff('subcontractors')">
<img src="subcontractorsOff.gif" height="40" width="133" name="subcontractors" id="subcontractors" border="0" alt="subcontractors"></a>

any insight would be great.
regards,
Fatmann66