|
JavaScript - Javascript Scrolling Element With You On Page
Its about this:
http://www.wduffy.co.uk/blog/keep-el...omment-page-1/ Everywhere is used for a whole div on some side and when its on the top of the page. But what if its in the middle..? Look here - http://phpbb.bg/viewtopic.php?f=14&p=1013#p1013 Scroll down and then up.Anyway to fix this? Similar TutorialsFYI http://www.hotscripts.com/forums/jav...croll-how.html Hi there, and happy new year. I am looking for a javascript code with the effect used by Google in the following example; http://www.google.co.uk/search?q=che...ient=firefox-a ... whereby the map scrolls with the page once it has been reached by the top of the browser. If anyone could point me in the right direction I would be very grateful. Many Thanks, Patrick. Hi, I am new to javascript,this is my first time using it, I am wishing to have 2 buttons on my website, one that scrolls to the bottom of my page when clicked and then stops at the bottom and one that scrolls back up the page when clicked, but I want my viewers to be able to see this movement. I have some code (below) which works fine in firefox but it doesn't work in explorer, and I can't get this code to work moving upwards (after taking away the minus from -50). Can anybody please help me I have been battling for days trying to make it work although I am finding it hard to understand javascript being a first time user. I currently have this javascript : [CODE] <head> <script language="JavaScript"> function pageScrollup() { window.scrollBy(0,-50); // horizontal and vertical scroll increments if (window.pageYOffset) { scrolldelay = setTimeout('pageScrollup()',5); } } </script> </head> <body> <a href="JavaScriptageScrollup()">Back to Top</a> </body>[ICODE] Any help is greatly appreciated. OrangeAnt Hello. I have a table with td elements containing numbers in one row and td elements containing textareas in the second row like this: http://motionsroom.com/example.html I want to find an easy way for the user to click, draw a rectangle around or whatever around any several numbers so that they they would be put in a single td element instead of two or three (so we would have: "49 and 12" as the new value) and then the textareas below would also merge. Ideally, I would like to have a rectangle like in RTS games but then I would settle on whatever is easy. Is there any way I could do that? Thanks! Hi. I am very new to javascript, so I might not even be wording my question right, but I am going to try and be as concise and specific as possible. I am using jquery on my website- the galleria plugin- to make a slideshow. you can see the completed show he http://www.pauljameswilliams.com/demo2a.html This slideshow will be one of three on my website. Each slide show will opperate the same exact way.I have built in tabbed navifation, and the slideshows will all be accessable under the "portfolio" tab by clicking on their corresponding links. check out the site he http://www.pauljameswilliams.com/portfolio.html As it is I have one slideshow up, although not yet connected to the corresponding link, but the images won't load. My guess is that because the div tag is hidden that the contents don't load propperly and I need the contents to load when the corresponding div tag that it is contained in becomes visible but I don't know how to do that. this is the javascript that I have written to show/hide the <div> tags where the content will live. Three slide shows will live in content_2 and show/hide when the corresponding button is pressed. Code: function tabSwitch(new_tab, new_content) {
document.getElementById('content_1').style.display = 'none';
document.getElementById('content_2').style.display = 'none';
document.getElementById('content_3').style.display = 'none';
document.getElementById('content_4').style.display = 'none';
document.getElementById(new_content).style.display = 'block';
document.getElementById('btn_1').className = '';
document.getElementById('btn_2').className = '';
document.getElementById('btn_3').className = '';
document.getElementById('btn_4').className = '';
document.getElementById(new_tab).className = 'current';
}
thank you- I am really stuck. i promise, i am actually learning javascript, I'm not just trying to get other people to do my work for me. Hello. My goal is to load the JS for a specific element before displaying that element. I integrated a third part script, and it works well. I set the timer he The JS is in my heading as <script type="text/javascript" src="countdownpro.js"></script> About mid-body I have: <span id="countdown1">2010-07-20 00:00:00 GMT+00:00</span> which allows for the setting of a target date to countdown to. When the page first loads it shows the above long format target time, until the js/meta tags kick in to modify it to just show the actual countdown as 00:00:00. I have attached countdownpro.js to this post. I tried shifting the function CD_Init() to the top of the script, and also appended it inline with the .html. I tried setting the big external script to "defer", but neither arrangement worked. I also tried placing the src file right at the top. I appreciate your help. Hi - I don't know much about javascript, html, or web development. I have this javascript on my page (that is an iframe). <script type="text/javascript"> var site = 'http://' + 'localParameter("site_address")' <!-- window.location = site //--> </script> Note: site_address is a parameter that's passed to the page when loaded. Now, I need to make this iframe scroll down by like 50 pixels once the page is loaded. How can I do this? Thanks Hi Guys, I've been progressing along ok onthe CSS side of things but am having some trouble on the javascript side of things. I've decided to jazz a site up with a scrolling gallery from a template i'm using but unfortunately I don't know how to get the main image to change on a click of the smaller one? can anybody please help a brother out! here's the site template - http://dev.jeffking.co.uk/index.html All i'm after is the big main image to change to the same (larger) image of the smaller one in the scrollbar below the main frame. Many thanks! I am using the following code from this site... http://www.javascriptkit.com/script/...selector.shtml but for some reason if the page is long the whole page scrolls up so the top of the calendar is at the top of the browser, which actually hides the box that the date will end up in. can anyone see how I can alter the code so that the page does not scroll up, but have the calendar show just below the box that the date will go in and the page does not scroll? here is the full code that I am using to test this out with. Code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
.ds_box {
background-color: #FFF;
border: 1px solid #000;
position: absolute;
z-index: 32767;
}
.ds_tbl {
background-color: #FFF;
}
.ds_head {
background-color: #333;
color: #FFF;
font-family: Arial, Helvetica, sans-serif;
font-size: 13px;
font-weight: bold;
text-align: center;
letter-spacing: 2px;
}
.ds_subhead {
background-color: #CCC;
color: #000;
font-size: 12px;
font-weight: bold;
text-align: center;
font-family: Arial, Helvetica, sans-serif;
width: 32px;
}
.ds_cell {
background-color: #EEE;
color: #000;
font-size: 13px;
text-align: center;
font-family: Arial, Helvetica, sans-serif;
padding: 5px;
cursor: pointer;
}
.ds_cell:hover {
background-color: #F3F3F3;
} /* This hover code won't work for IE */
</style>
</head>
<body>
<table class="ds_box" cellpadding="0" cellspacing="0" id="ds_conclass" style="display: none;">
<tr><td id="ds_calclass">
</td></tr>
</table>
<script>
// <!-- <![CDATA[
// Project: Dynamic Date Selector (DtTvB) - 2006-03-16
// Script featured on JavaScript Kit- http://www.javascriptkit.com
// Code begin...
// Set the initial date.
var ds_i_date = new Date();
ds_c_month = ds_i_date.getMonth() + 1;
ds_c_year = ds_i_date.getFullYear();
// Get Element By Id
function ds_getel(id) {
return document.getElementById(id);
}
// Get the left and the top of the element.
function ds_getleft(el) {
var tmp = el.offsetLeft;
el = el.offsetParent
while(el) {
tmp += el.offsetLeft;
el = el.offsetParent;
}
return tmp;
}
function ds_gettop(el) {
var tmp = el.offsetTop;
el = el.offsetParent
while(el) {
tmp += el.offsetTop;
el = el.offsetParent;
}
return tmp;
}
// Output Element
var ds_oe = ds_getel('ds_calclass');
// Container
var ds_ce = ds_getel('ds_conclass');
// Output Buffering
var ds_ob = '';
function ds_ob_clean() {
ds_ob = '';
}
function ds_ob_flush() {
ds_oe.innerHTML = ds_ob;
ds_ob_clean();
}
function ds_echo(t) {
ds_ob += t;
}
var ds_element; // Text Element...
var ds_monthnames = [
'January', 'February', 'March', 'April', 'May', 'June',
'July', 'August', 'September', 'October', 'November', 'December'
]; // You can translate it for your language.
var ds_daynames = [
'Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'
]; // You can translate it for your language.
// Calendar template
function ds_template_main_above(t) {
return '<table cellpadding="3" cellspacing="1" class="ds_tbl">'
+ '<tr>'
+ '<td class="ds_head" style="cursor: pointer" onclick="ds_py();"><<</td>'
+ '<td class="ds_head" style="cursor: pointer" onclick="ds_pm();"><</td>'
+ '<td class="ds_head" style="cursor: pointer" onclick="ds_hi();" colspan="3">[Close]</td>'
+ '<td class="ds_head" style="cursor: pointer" onclick="ds_nm();">></td>'
+ '<td class="ds_head" style="cursor: pointer" onclick="ds_ny();">>></td>'
+ '</tr>'
+ '<tr>'
+ '<td colspan="7" class="ds_head">' + t + '</td>'
+ '</tr>'
+ '<tr>';
}
function ds_template_day_row(t) {
return '<td class="ds_subhead">' + t + '</td>';
// Define width in CSS, XHTML 1.0 Strict doesn't have width property for it.
}
function ds_template_new_week() {
return '</tr><tr>';
}
function ds_template_blank_cell(colspan) {
return '<td colspan="' + colspan + '"></td>'
}
function ds_template_day(d, m, y) {
return '<td class="ds_cell" onclick="ds_onclick(' + d + ',' + m + ',' + y + ')">' + d + '</td>';
// Define width the day row.
}
function ds_template_main_below() {
return '</tr>'
+ '</table>';
}
// This one draws calendar...
function ds_draw_calendar(m, y) {
// First clean the output buffer.
ds_ob_clean();
// Here we go, do the header
ds_echo (ds_template_main_above(ds_monthnames[m - 1] + ' ' + y));
for (i = 0; i < 7; i ++) {
ds_echo (ds_template_day_row(ds_daynames[i]));
}
// Make a date object.
var ds_dc_date = new Date();
ds_dc_date.setMonth(m - 1);
ds_dc_date.setFullYear(y);
ds_dc_date.setDate(1);
if (m == 1 || m == 3 || m == 5 || m == 7 || m == 8 || m == 10 || m == 12) {
days = 31;
} else if (m == 4 || m == 6 || m == 9 || m == 11) {
days = 30;
} else {
days = (y % 4 == 0) ? 29 : 28;
}
var first_day = ds_dc_date.getDay();
var first_loop = 1;
// Start the first week
ds_echo (ds_template_new_week());
// If sunday is not the first day of the month, make a blank cell...
if (first_day != 0) {
ds_echo (ds_template_blank_cell(first_day));
}
var j = first_day;
for (i = 0; i < days; i ++) {
// Today is sunday, make a new week.
// If this sunday is the first day of the month,
// we've made a new row for you already.
if (j == 0 && !first_loop) {
// New week!!
ds_echo (ds_template_new_week());
}
// Make a row of that day!
ds_echo (ds_template_day(i + 1, m, y));
// This is not first loop anymore...
first_loop = 0;
// What is the next day?
j ++;
j %= 7;
}
// Do the footer
ds_echo (ds_template_main_below());
// And let's display..
ds_ob_flush();
// Scroll it into view.
ds_ce.scrollIntoView();
}
// A function to show the calendar.
// When user click on the date, it will set the content of t.
function ds_sh(t) {
// Set the element to set...
ds_element = t;
// Make a new date, and set the current month and year.
var ds_sh_date = new Date();
ds_c_month = ds_sh_date.getMonth() + 1;
ds_c_year = ds_sh_date.getFullYear();
// Draw the calendar
ds_draw_calendar(ds_c_month, ds_c_year);
// To change the position properly, we must show it first.
ds_ce.style.display = '';
// Move the calendar container!
the_left = ds_getleft(t);
the_top = ds_gettop(t) + t.offsetHeight;
ds_ce.style.left = the_left + 'px';
ds_ce.style.top = the_top + 'px';
// Scroll it into view.
ds_ce.scrollIntoView();
}
// Hide the calendar.
function ds_hi() {
ds_ce.style.display = 'none';
}
// Moves to the next month...
function ds_nm() {
// Increase the current month.
ds_c_month ++;
// We have passed December, let's go to the next year.
// Increase the current year, and set the current month to January.
if (ds_c_month > 12) {
ds_c_month = 1;
ds_c_year++;
}
// Redraw the calendar.
ds_draw_calendar(ds_c_month, ds_c_year);
}
// Moves to the previous month...
function ds_pm() {
ds_c_month = ds_c_month - 1; // Can't use dash-dash here, it will make the page invalid.
// We have passed January, let's go back to the previous year.
// Decrease the current year, and set the current month to December.
if (ds_c_month < 1) {
ds_c_month = 12;
ds_c_year = ds_c_year - 1; // Can't use dash-dash here, it will make the page invalid.
}
// Redraw the calendar.
ds_draw_calendar(ds_c_month, ds_c_year);
}
// Moves to the next year...
function ds_ny() {
// Increase the current year.
ds_c_year++;
// Redraw the calendar.
ds_draw_calendar(ds_c_month, ds_c_year);
}
// Moves to the previous year...
function ds_py() {
// Decrease the current year.
ds_c_year = ds_c_year - 1; // Can't use dash-dash here, it will make the page invalid.
// Redraw the calendar.
ds_draw_calendar(ds_c_month, ds_c_year);
}
// Format the date to output.
function ds_format_date(d, m, y) {
// 2 digits month.
m2 = '00' + m;
m2 = m2.substr(m2.length - 2);
// 2 digits day.
d2 = '00' + d;
d2 = d2.substr(d2.length - 2);
// YYYY-MM-DD
// return y + '-' + m2 + '-' + d2;
return d2 + '-' + m2 + '-' + y;
}
// When the user clicks the day.
function ds_onclick(d, m, y) {
// Hide the calendar.
ds_hi();
// Set the value of it, if we can.
if (typeof(ds_element.value) != 'undefined') {
ds_element.value = ds_format_date(d, m, y);
// Maybe we want to set the HTML in it.
} else if (typeof(ds_element.innerHTML) != 'undefined') {
ds_element.innerHTML = ds_format_date(d, m, y);
// I don't know how should we display it, just alert it to user.
} else {
alert (ds_format_date(d, m, y));
}
}
// And here is the end.
// ]]> -->
</script>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<form action="" method="post">
<div>
<b>Example Form</b><br/>
Please input a date: <input onclick="ds_sh(this);" name="date" readonly="readonly" style="cursor: text" /><br />
Please input another date: <input onclick="ds_sh(this);" name="date2" readonly="readonly" style="cursor: text" /><br />
<input type="submit" value="Submit" />
</div>
</form>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
</body>
</html>
Hi, I have an .aspx page which the author claims to be an RSS feed (http://gcn.com/rss-feeds/state-local.aspx). It is simply a list of links with a description for each. I am trying to embed these links into an RSS feed on my own page. I am using code from http://www.mioplanet.com/rsc/newsticker_javascript.htm to create the scrolling ticker. Do I need to do something to convert the .aspx page to an RSS feed? Please help. Thanks. I'm attaching my php test file but this is a JS problem. When I scroll down in the web page and the meta refresh hits, in Windows Safari and IE6/7/8 browsers, the web page re-positions back to the top. In Opera and FF the page refreshes but it stays where it is. Can someone look at my test script and see why it is not working in IE and Win Safari? My goal is to have the web page not re-position to the top on the auto refresh. Thanks... HI I want to write a search for my site .I make a new panel in the left of my menue and it has a text input and an image which when that user click on it javascript opens a new window which is a php page.The part I don't know how to do is when the user click on the image it should get the content of the text input and pass it to the url.For the hyperlink of the image I use "<a href="javascriptpen_window('includes/func/search.php?id=" But I don't know what should I write after that to get the content of the text input and put it in the next of the id. How can I do so? Thanks I am using a jQuery slider for a website but the W3C comes up with invalid because: document type does not allow element "div" here .before('<div id="buttons">') Code: <script type="text/javascript">
$(document).ready(function() {
$('#slider')
.before('<div id="buttons"></div>')
.cycle({
fx: 'fade', // choose your transition type, ex: fade, scrollUp, shuffle, etc...
pager: '#buttons'
});
});
</script>
Any help with this would be appreciated thanks. if you take a look at this site here you can see that it no longer scrolls or even displays content, but here it does. I'll bet there's a quick fix here, but not sure what it is. Any ideas?
After months of searching the web, and found nothing about javascript drag and drop kinetic scrolling, I decided to develop it by myself, relying on my flash knowledge, because I was created kinetic scrolling in flash with ease! And now, after learning javascript a little bit and spending almost a week, I finally succeded to create such a thing in javascript! And I'm ready to share it with you, but I need a little help from someone more experienced to fix an small issue ! Here is the code: Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>JavaScript Drag and Drop Tutorial</title>
</head>
<body onload="borders()">
<div style="position:absolute; left:0%; top:0%; ">
<style type="text/css">
.drag {
position: absolute;
}
</style>
<div style=" position:absolute; width:100%; height = 100%; left:0%; top: 0%" id="pageContainer">
<input id="1" class="drag" style="width:100px; height:100px; top: 0px" type="submit" value="Drag 'n' throw me">
<input id="2" class="drag" style="width:100px; height:100px; top: 120px" type="submit" value="Drag 'n' throw me">
<input id="3" class="drag" style="width:100px; height:100px; top: 240px" type="submit" value="Drag 'n' throw me">
<pre id="debug"> </pre>
</div>
<script language="JavaScript" type="text/javascript">
<!--
//Kinetic moving script
var x = ""
var y = ""
var i = 1
var dest_x = ""
var dest_y = ""
var date = new Date();
var time1=date.getTime();
var Xpos_diff = ""
var Ypos_diff = ""
var time_diff = ""
var objID = ""
function kinetic() {
var dragobj = document.getElementById(objID);
//Keep on moving the image till the target is achieved
x = (x - dest_x) * 0.97 + dest_x;
y = (y - dest_y) * 0.97 + dest_y;
//Move the image to the new location
dragobj.style.left = x+'px';
dragobj.style.top = y+'px';
if (i < 1) {
window.setTimeout('kinetic()',10);
}
}
//Drag and drop + thtow calculation___________________________________________________________________________________________________
function $(id){
return document.getElementById(id);
}
var _startX = 0; // mouse starting positions
var _startY = 0;
var _offsetX = 0; // current element offset
var _offsetY = 0;
var _dragElement; // needs to be passed from OnMouseDown to OnMouseMove
var _oldZIndex = 0; // we temporarily increase the z-index during drag
var _debug = $('debug'); // makes life easier
InitDragDrop();
function InitDragDrop()
{
document.onmousedown = OnMouseDown;
document.onmouseup = OnMouseUp;
}
function OnMouseDown(e)
{
i = 1
// IE is retarded and doesn't pass the event object
if (e == null)
e = window.event;
// IE uses srcElement, others use target
var target = e.target != null ? e.target : e.srcElement;
objID = ExtractNumber(target.id)
var dragobj = document.getElementById(objID);
x=dragobj.style.left
y=dragobj.style.top
dest_x=dragobj.style.left
dest_y=dragobj.style.top
// for IE, left click == 1
// for Firefox, left click == 0
if ((e.button == 1 && window.event != null ||
e.button == 0) &&
target.className == 'drag')
{
// grab the mouse position
_startX = e.clientX;
_startY = e.clientY;
// grab the clicked element's position
_offsetX = x1 = ExtractNumber(target.style.left);
_offsetY = y1 = ExtractNumber(target.style.top);
// bring the clicked element to the front while it is being dragged
_oldZIndex = target.style.zIndex;
target.style.zIndex = 10000;
// we need to access the element in OnMouseMove
_dragElement = target;
// tell our code to start moving the element with the mouse
document.onmousemove = OnMouseMove;
// cancel out any text selections
document.body.focus();
// prevent text selection in IE
document.onselectstart = function () { return false; };
// prevent IE from trying to drag an image
target.ondragstart = function() { return false; };
// prevent text selection (except IE)
return false;
}
}
function ExtractNumber(value)
{
var n = parseInt(value);
return n == null || isNaN(n) ? 0 : n;
}
function OnMouseMove(e)
{
if (e == null)
var e = window.event;
// this is the actual "drag code"
_dragElement.style.left = (_offsetX + e.clientX - _startX) + 'px';
_dragElement.style.top = (_offsetY + e.clientY - _startY) + 'px';
x=_offsetX + e.clientX - _startX
y=_offsetY + e.clientY - _startY
dest_x = _offsetX + e.clientX - _startX
dest_y = _offsetY + e.clientY - _startY
Xpos_diff = (_offsetX + e.clientX - _startX) - x1
Ypos_diff = (_offsetY + e.clientY - _startY) - y1
x1 = _offsetX + e.clientX - _startX
y1 = _offsetY + e.clientY - _startY
var date = new Date()
var time2 = date.getTime();
time_diff = time2-time1
time1 = time2
}
function OnMouseUp(e)
{
if (_dragElement != null) {
_dragElement.style.zIndex = _oldZIndex;
// we're done with these events until the next OnMouseDown
document.onmousemove = null;
document.onselectstart = null;
_dragElement.ondragstart = null;
// this is how we know we're not dragging
_dragElement = null;
dest_x = x + time_diff * Xpos_diff*3
dest_y = y + time_diff * Ypos_diff*3
i = 0
kinetic()
}
else{
i = 1
x=_dragElement.style.left
y=_dragElement.style.top
dest_x=_dragElement.style.left
dest_y=_dragElement.style.top
}
}
//-->
function borders(){
if(x<0){
dest_x = 0
}
else if(x>document.documentElement.clientWidth-100){
dest_x = document.documentElement.clientWidth-100
}
if(y<0){
dest_y = 0
}
else if(y>document.documentElement.clientHeight-100){
dest_y = document.documentElement.clientHeight-100
}
window.setTimeout('borders()',10)
}
</script>
</div>
</body>
</html>
What need to be fixed is an small issue when start dragging the object and then stop moving while you still drag object, after release the mouse in still position the object will make a small move! And that must not happening! You will see by yourself what I meant, just drag and throw object! If you like it you are free to use it! All I want is someone to help fix this issue! Does anyone know what's wrong with this code because when the page loads, the link is not being hidden Code: window.onload = setTarget;
function setTarget()
{
var theLinks = document.getElementsByTagName('a');
for(var i = 0; i < theLinks.length; i++)
{
if(theLinks[i].getAttribute('href') == '/subjects/new')
{
theLinks[i].style.display = "none";
}
}
}
How do i set a page element as a variable and change it? Ive googled the internet like crazy for an answer for this, but couldnt find it. Im trying to create an animation. My question is, how do i change the width of a div onclick? Essentially, I want it to add one percent of the value of the width of the div every one second.. PHP Code: <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Loading Bar</title> <script> var x = getElementById("loadbar").style.width; function load(){ setTimeout ( "progress()", 1000 ); } function progress(){ x++; } </script> </head> <body> <div id="load" style="border:thin solid #6699FF; width:300px; height:10px"> <div id="loadbar" style="background:#6699CC; width:0%; height:100%"> </div> </div> <a href="#" onclick="load()">Click to load</a> </body> 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 I am new to javascript and would like to search for the element with id but the element id are changing if i use different navigation in that web page example: C21_W68_V69_notes_struct.text changes to C24_W78_V79_notes_struct.text or any other name next time hence i would like to search that element using a pattern like notes_struct.text as there exist only one element ending with this pattern. I am using old version IE and would like to use javascript only. Kindly help. |
|||||||