|
JavaScript - Trying To Change The Status Bar Of Window Object
I have a simple problem, I can't get the status bar to change. I am very new to javascript, and I am trying to practice some simple commands, and the onMouseOver event is suppose to change the status bar in my window. I can get it to change for onMouseOut but not onMouseOver. Here is what I have so far
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <HTML> <HEAD> <TITLE>Exam</TITLE> </HEAD> <BODY> <H3>My Page</H3> <a href="http://www.google.com" onMouseOver="window.status='Visit google.';return true;" onMouseOut="window.status='Come back soon ';return true;">Visit Google</a> </BODY> </HTML> Similar TutorialsHi All I have a list of links on my website with anchors coded the following way: <ul class="fav"><a href="/cgi-bin/send.pl?ID=XX" onMouseOver="window.status='http://www.domain.com'; return true;" onMouseOut="func_clear(); return true;" onClick="stat(294);" target="_blank">Linked domain name</a></ul> Then I have found on http://www.askthecssguy.com/2006/12/..._favicons.html a javascript to display a favicon image before each one of my links in the list; this script is working fine when getting the domain name from href value. But in my case the suitable domain name to load each favicon is present in window.status value. I have played a bit with the above scripts and finally I'm trying to use the following function: Code: function faviconizeFavicon() {
if (!document.getElementsByTagName) return false;
if (!document.createElement) return false;
var ul = document.getElementsByTagName("ul");
for (var i=0; i<ul.length; i++) {
if (ul[i].className == "fav") {
var links = ul[i].getElementsByTagName("a");
for (var j=0; j<links.length; j++) {
var hrefvalue = links[j].parentNode.innerHTML;
var domain = 'default_favicon.gif';
domain = hrefvalue.match(/(\w+):\/\/([^/:]+)(:\d*)?([^# ]*)\'/g);
try{
var cue1 = document.createElement("img");
cue1.className = "favicon";
cue1.src = 'default_favicon.gif';
cue1.id = 'img' +i+ j;
links[j].parentNode.insertBefore(cue1,links[j]);
var cue = document.createElement("img");
cue.className = "favicon";
var cuesrc = "http://"+ domain + "/favicon.ico";
cuesrc = cuesrc.replace("http://http://","http://");
cuesrc = cuesrc.replace("'/favicon.ico","/favicon.ico");
cue.setAttribute("imgid",'img' +i+ j);
cue.setAttribute("src",cuesrc);
cue.onload = function () {
document.getElementById(this.getAttribute("imgid")).src = this.src;
}
cue.setAttribute("src",cuesrc);
}
catch ( ex )
{
}
}
}
}
}
This javascript should display first the default locally available favicon gif before each link and then try to load original favicons from each domain and display them at the place of default favicon gif only if available. The above code works with any console errors but very randomly and not with all websites ?? Some favicons are loaded from distant websites and some of them never, independing of network quality or other factors! So I'm wondering why this code is not working for each link ? My question is: could you please have a look on my following Regex if this should work in every case with each domain name ? domain = hrefvalue.match(/(\w+):\/\/([^/:]+)(:\d*)?([^# ]*)\'/g); I put the apostrophe at the end because my url in window.status is always ended by a single closing. Also I'm asking if taking into account that ONLY my window.status value is placed between single apostrophes and ALL other values of my anchors are opened and closed with double apostrophes, maybe it would be easier to get my domain value searching for any value between two single apostrophes ?? My another question is: Is it possible that other javascripts present in my html code could interfere with this script and make it working randomly ? Thanks in advance for any clues Hi, I am writing an application which needs to open a modal dialog window in a secure connection. I am able to open the dialog using HTTPS, but on the status bar I cannot see the SSL Padlock. The application is being written in .NET and the browser I use is IE 6.0. Any suggestions and feedback are welcome. Regards Totre Hi All, I have a form that captures member registration details. In the admin section .. I would like to change the Status field of a record/s from NEW to PAYMENT DUE after 14 days from the data of submission. The status change should automatically trigger on the 15th day. So when the admin checks the list page he/she should be able to view the updated status field. Any pointers how to accomplish this? Thanks in advance. Vinny Hi there, I hope I post this in the right section. I'm trying to do a redirect using the below code: <script type="text/javascript"> window.location.href = "http://google.com" </script> FF and IE work as they should. Chrome doesn't. The request above to http://google.com, gets a 'canceled' status in Chrome browser > Development tools > "Network". I've tried several other functions: location.href = url location.replace(url) document.location = url location.assign(url) window.open(url, '_self') Same code pasted within a local html file works fine. Below is the redirect request that it's canceled by chrome: http://pastebin.com/hD36M1RG Any clues? Thanks Hello together! I generate html code with jsp. In that jsp there a several framesets and frames. And yes i know, frames are not really up to date but it's an old program and i have to deal with it now. Anyway, in the top frameset i have an onload attribute like onload="load()". In the function load i want to access the Element.prototype object. But unfortunately typeof Element gives me "undefined". So i looked a little deeper and found that window.toString() gives me "[object]" and not as expected "[object window]" so somehow my window doesn't know that its construcor is Window. window.construcor is "undefined" as well. And i don't have access to the Element object. I really don't know where the error could be. When the page is loaded and i access the same window over the console, then everything is right. But in my function a can't get access to the objects i need. I also don't know what part of the code could be useful to post here, but maybe someone had a similar problem before? i should say that this problem only occurs in IE8. In IE9 it works perfectly. Has anyone any idea?? In my current javascript code, the window object is being used. But my issue is that if you are slightly zoomed in or out it is not placed correctly. So is there any way to make it take into account the browser zoom level? Code: windowHeight=$(window).height(),windowWidth=$(window).width(), Code: projectedTop=scrollPos['scrollTop']+((windowHeight/2)-(correctSizes['containerHeight']/2)) I have some code that creates a DHML window, I'll call that code MyDHTMLWin . Now what happens is I create a new MyDHTMLWin object and what happens inside that is it creates an iFrame. Now in my init method I do this.. this.iFrameObj.dhtmlWinObj = this; What I what to do is from inside the file loaded in the iFrame is be able to get the object that opened the window. I did used to do var newWin = new dhtmlWinObj(....); and then parent.newWin.anything() but this is no longer fit for purpose as I reuse this code and the variable names will change. But no matter what I try I just can't seem to get that object that should be stored in the iFrames dhtmlWinObj attribute. I thought it would be this.dhtmlWinObj but that doesn't work How can I get the object that opened my DHTML window??? TIA, Dale I am and seem to remain newbie ... I have a JS script that presents a series of "pages" with different questions inside a single HTML file, by rewriting certain <div>s. I have an object like this that contains the questions and information about answer labels etc (the idea is that this should be easy to modify for someone who doesn't know JS): Code: var Questions = [
{
"question" : "How good is this?",
"labels" : ["excellent","very good","good","bad","very bad","awful"],
"page" : 0 ,
"random" : false ,
"type" : "default",
"varname" : "allgood"
},
{
"question" : Change[curCase]+"What do you think now?",
"labels" : BetterLabels,
"page" : 1 ,
"random" : true ,
"type" : "default",
"varname" : "betteradapt"
}
]
This object is initialized when the page loads, and a function reads the total number of pages by getting the maximum number of the "page" property across elements. Later, the object is accessed by thenextQuestion() function which uses the "page" property to looks whether each element belongs on the current page , then reads out the properties and presents the question. This works okay. Now the tricky bit: For some questions, their text should be different depending on which case is currently on the screen (Change[curCase]). curCase is different on each page, an integer between 0 and Change.length. I cannot get this to work for the Questions object, probably because the Questions object has been already initialized when the page loaded. How can I get my function nextQuestion() to "re-evaluate" the property "question" for all the elements of the Questions objectwhen nextQuestion() is called , using the current value of "curCase"? nextQuestion() is longer, but the (i think!) crucial bits are he Look whether question belongs on current page and push it onto new array: Code: for (i=0; i < Questions.length; i++) {
Questions[i].page = Questions[i].page;
if ( Questions[i].page == BlockNum ) { // if the q belongs on the current page
QuestionsObjectThisPage.push(Questions[i]);
}
}
Then, extract an array containing the questions, which will then be presented: Code: for (i=0; i < QuestionsObjectThisPage.length; i++) {
QuestionsThisPage.push(QuestionsObjectThisPage[i].question) ;
}
So what I'm looking for is something to change either of these two Object.push() functions so they don't simply take the value they find in the Questions (or QuestionsThisPage) object, but to re-evaluate the code for the "questions" property, taking into account the current value of curCase Phew. I found that really hard to describe; hope it's somewhat clear. IE is throwing an error stating window.document.forms[...].elements is null or not an object. in the following code Code: var changeHandler = function() {
this.form.calculateDependencies();
return true;
};
for(var i = 0; i < arguments.length; ++i) {
for(var j = 0, e = window.document.forms[arguments[i]].elements; j < e.length; ++j) {
addEvents([e[j]], ["change", "keyup", "focus", "click", "keydown"], changeHandler);
e[j].hide = hideEl;
e[j].show = showEl;
}
(e = window.document.forms[arguments[i]]).calculateDependencies = calcDeps;
e.calculateDependencies();
}
}
FF and Chrome seem to work ok, but it breaks in IE. What am I doing wrong here? Hopefully someone can help a newbie with this. I have a map with onclick areas. When you click these areas, a popup window displays a text file. This is rather cumbersome, so I thought of using a popup box instead of a window and linking this to an onmouseover and onmouseout event. The only problem I have is trying to find out how to dump the contents of the text file into the popup box using the simplest means. The URL of the map I am trying to do this with is: http://www.intercitycharters.com/Weather/Summary.php Any suggestions? Hi, I'm creating web application that picks out a randomly chosen image from google, and displays it in the browser window every time it is refreshed. What I'm struggling with is that I want the browser window to resize automatically to exactly fit the image displayed. I know how to resize a browser window, but I want it done dynamically. Can anyone help me with this? hey, is there any way i can change an elements properties in window open? i click a link and it opens a window with window.open, and i want to take something from the current page and place it inside a textarea within the opened window.. is it possible? I am working on an interest and investment calculator for a class project. On my list of drop down options, one of the options isnt an integer value like the rest. It's value is "other", while the other three are 1000, 5000, 1000, and 25000. What I would like to do is when the user chooses the "other amount" option from the drop down list, a prompt window will come up asking the user for an investment amount. I am having problems creating a function in my javascript file for this, and then taking the value entered and assigning a variable in another function with that new value so that it calculates with the users input. Please help. The first part of the attachment is the label with the "other" value I explained. And the second piece of code is my mess of a function that I tried to create for the prompt window to come up and store the users value and then change the value of the option. I'm new at this and am lost..... This is in my HTML: <label for="investment">One-Time Investment:</label> <select name="investment" id="investment" <optgroup label=""> <option value="1000">$1,000</option> <option value="5000">$5,000</option> <option value="10000">$10,000</option> <option value="25000">$25,000</option> <option value="other" >Other value</option> </optgroup> </select><br /> This is in my javascript file: var show_prompt = function() { if ($("other").checked ==true){ var number = prompt("please enter an investment amount", "1000"); var numb = parseFloat(number); $("other").value = numb; }else{ alert("Please enter your investment amount"); } return numb; } Code: blinkOnNewMessage: function(dateObject, userID, userName, userRole, messageID, messageText, channelID, ip) {
if(this.settings['blink'] && this.lastID && !this.channelSwitch && userID != this.userID) {
clearInterval(this.blinkInterval);
this.blinkInterval = setInterval(
'ajaxChat.blinkUpdate(\''+this.addSlashes(this.decodeSpecialChars(userName))+'\')',
this.settings['blinkInterval']
);
}
},
blinkUpdate: function(blinkStr) {
if(!this.originalDocumentTitle) {
this.originalDocumentTitle = document.title;
}
if(!arguments.callee.blink) {
document.title = '[@ ] '+blinkStr+' - '+this.originalDocumentTitle;
arguments.callee.blink = 1;
} else if(arguments.callee.blink > this.settings['blinkIntervalNumber']) {
clearInterval(this.blinkInterval);
document.title = this.originalDocumentTitle;
arguments.callee.blink = 0;
} else {
if(arguments.callee.blink % 2 != 0) {
document.title = '[**** ] '+blinkStr+' - '+this.originalDocumentTitle;
} else {
document.title = '[ New message!!!] '+blinkStr+' - '+this.originalDocumentTitle;
}
arguments.callee.blink++;
}
},
Hi friends, I want to flash taskbar when user minimized window during chat. I have above code which simply change the title name but i want to change the color also of taskbar. How I can do it?? Please help??? Thanks in advance..... Hi, Which javascript event should be used to call logout on window close and url change. I want to call logout function on window close and URL change on my application. I am calling logout functionon on <body onunload="doLogout();">, but onunload event is also called when refreshing the page. is there any specific event for Windoe close and URL change. can anyone resolve this issue. Regrads, Abha Hi, every time I try and alert: [ { number:0, secondnumber:0 }, { number:2, secondnumber:1 }, { number:1, secondnumber:2 } ] it just shows [object object], [object object], [object object]. Why is this and what can I do to make the record be shown as it is above in an alert? Thanks. I created a method for displaying an object's properties: Code: renderfunction = false;
function showProperty (object, property)
{
document.write ('<td class="type">' + (typeof object[property]) + '</td>'
+ '<td class="name">' + property + '</td>');
document.writeln('<td class="value">' +
(
(typeof object[property] != 'function')
? object[property]
:(
(property != 'showProperties')
? (
renderfunction
? object[property]()
: ('<span class="self">NOT RENDERED</span>')
)
: ('<span class="self">THIS</span>')
)
)
+ '</td>');
document.writeln('<td class="hasOwnProperty" >'
+ (
object.hasOwnProperty(property)
? "Local"
: "Inherited"
)
+ '</td>');
if (typeof object[property] == 'function')
{
document.writeln ('<td class="function">' + object[property] + '</td>');
}
else
{
document.writeln ('<td class="function"> </td>');
}
}
As long as renderfunction = false, the object is fine coming out of this function. However, if I change renderfunction to true, all my properties become undefined. Why isn't this working as I expect it to? How should I fix it? Thanks in advance, -Brian. I can't get any info from Firebug except that one line, uncaught exception [object Object]. The code fully worked, then I needed to make it dynamically create Sortables from the scriptaculous library based on how many X were in a table in my database, which I've done, and I'm thinking it may be a simple slight parse error of some type, I'm not too good with Javascript, because now my script barely works. I've double checked the script's source code, the PHP variables are exactly what they should be. Code: print<<<HERE
Sortable.create('sortlist$box', { tag: 'img', overlap:'horizontal',constraint:false, containment: $list, dropOnEmpty: true,
onChange: function(item) {
var list = Sortable.options(item).element;
if(changeEffect) changeEffect.cancel();
changeEffect = new Effect.Highlight('changeNotification', {restoreColor:"transparent" });
},
onDrop: function(item) {
var thing=Sortable.options(item).element.identify();
var anchors = document.getElementById(thing).childNodes.length-2;
if(anchors > 20){
alert('This box had 20 creatures in it already, your last action has not been saved.');
window.location.reload();
}
else{
new Ajax.Request("saveImageOrder.php", {
method: "post",
parameters: { data: Sortable.serialize("sortlist$box") }
});
}
}
});
HERE;
$box++;
}
?>
});
</script>
if you solve this I'll send ya $10 via paypal Hi i'm in need of some help with a javascript function I have been working day and night trying to get this to work and its almost there, basicly what I am trying to do is create a facebook like status update box with user tagging and member search drop down. Currently I have the status update input where users can enter in their status update, this also has a user tagging system with it which when you type the '@' symbol the friend search displays and once a name is clicked the @ sign plus what you was writing gets replaced with that name but what I am in need of is someone who can sort this problem out, this problem is I want the user to click on the name but once clicked i need the name to show up as a blue link just like facebook do and also i need the backend of the system to check when a name is click to get the id number of that user and set the bbcode in the status area as my bbcode system uses [quote=123432]username[/quote] which is how what quotes the user now I also need to have a rich text area instead of the standard html one as I need the area to display the link and not the bbcode. If any one can help please reply, Thank you, DJCMBear. P.S. Here are the codes I have so far just for someone to over look to see if they can sort it out. The Javascript Class: Code: <script type="text/javascript">
var SDK = {
setCursor: function(el)
{
if(el.selectionStart)
{
return el.selectionStart;
}
else if (document.selection)
{
el.focus();
var r = document.selection.createRange();
if (r == null)
{
return 0;
}
var re = el.createTextRange(),
rc = re.duplicate();
re.moveToBookmark(r.getBookmark());
rc.setEndPoint('EndToStart', re);
return rc.text.length;
}
return 0;
},
displayFriends: function(cp)
{
var friendSession = document.getElementById('fsi');
var friendSelect = document.getElementById('fs');
var selectText = document.getElementById('fst');
var info = friendSession.value.split(':');
var checker = info[0];
var position = parseInt(info[1]);
if(window.event.keyCode == 192 && friendSession.value == 0)
{
friendSelect.style.display = 'block';
friendSession.value = 1+':'+this.setCursor(cp);
}
else if(friendSession.value == 0)
{
friendSelect.style.display = 'none';
}
else if(friendSession.value == 1 && window.event.keyCode == 8 && selectText.value.substr(position,1) != "@")
{
friendSession.value = 0;
friendSelect.style.display = 'none';
}
},
selectFriend: function(selection)
{
var input = document.getElementById('fst');
var info = document.getElementById('fsi').value.split(':');
var checker = info[0];
var position = parseInt(info[1]);
if(checker == 1)
{
input.focus();
input.value = input.value.substring(0,position)+selection.innerHTML+' ';
document.getElementById('fsi').value = 0;
document.getElementById('fs').style.display = 'none';
input.focus();
}
},
shrink: function(current,newid)
{
var friendSession = document.getElementById('fsi');
var old = document.getElementById(newid);
if(current.value == '' && friendSession.value.substring(0,1) != 1)
{
current.style.display = 'none';
current.value = '';
old.style.display = 'block';
}
},
grow: function(current,newid)
{
var input = document.getElementById(newid);
current.style.display = 'none';
input.style.display = 'block';
input.style.height = '70px';
input.focus();
},
StatusForm: function(info)
{
var form = "<div id=\"statusUpdater\"><div onclick=\"SDK.grow(this,\'fst\');\" id=\"dfst\">"+info.defaultTxt+"</div>";
form += "<textarea style=\"display:none;\" id=\"fst\" onclick=\"SDK.grow(this,'fst');\" onblur=\"SDK.shrink(this,'dfst');\" onkeydown=\"SDK.displayFriends(this);\" onkeyup=\"SDK.displayFriends(this);\"></textarea>";
form += "<input type=\"hidden\" id=\"fsi\" value=\"0\" /><div id=\"fs\" style=\"display:none;\">";
form += "<ul><li onclick=\"SDK.selectFriend(this);\" style=\"cursor:pointer;\">Bobby Frank</li>";
form += "<li onclick=\"SDK.selectFriend(this);\" style=\"cursor:pointer;\">Dan Dave</li>";
form += "<li onclick=\"SDK.selectFriend(this);\" style=\"cursor:pointer;\">John Doe</li></ul></div></div>";
document.write(form);
}
}
</script>
The CSS Styles: Code: <style type="text/css">
* {
margin: 0;
padding: 0;
}
#statusUpdater {
width: 500px;
margin: 30px auto;
}
#fst {
width: 100%;
}
#dfst {
width: 98.5%;
}
#fst, #dfst {
font-family: arial;
padding: 3px;
font-size: 14px;
resize: none;
border: 1px solid #666;
color: #666;
cursor: text;
background: #fff;
overflow-y: auto;
height: 16px;
}
#fs {
margin: 0;
width: 99.8%;
border: 1px solid #000;
border-top: 0px;
}
#fs ul {
list-style: none;
}
#fs li {
padding: 3px;
}
</style>
The Javascript Form Call: Code: <script type="text/javascript">SDK.StatusForm({'defaultTxt':'What\'s on your mind?','action':'http:\/\/www.example.com\/ajax\/statusPost.ax'});</script>
I've started studying JavaScript recently. The following simple scenario from the Russian textbook is not implemented properly on my PC. Code: <HTML>
<HEAD>
<TITLE>Link Description</TITLE>
<SCRIPT LANGUAGE="JavaScript">
function describe(text) {
window.status = text;
return true;
}
function clearstatus() {
window.status="";
}
</SCRIPT>
</HEAD>
<BODY>
<h1>Link Description</h1>
<P><i>Put mouse pointer over links to display their description</i></P>
<ul>
<li><A HREF="order.html"
onMouseOver="describe('Закажите товар'); return true;"
onMouseOut="clearstatus()";>
Заказ товаров</A>
<li><A HREF="email.html"
onMouseOver="describe('Направьте письмо'); return true;"
onMouseOut="clearstatus()";>
Email</A>
<li><A HREF="complain.html"
onMouseOver="describe('Раскритикуйте все'); return true;"
onMouseOut="clearstatus()";>
Отдел защиты прав потребителей</A>
</ul>
</BODY>
</HTML>
I just typed the script from the book char by char. I use Firefox browser, v.3.5.7. The error console does not display any mistakes. Please, explain me why on placing mouse over a link the status bar displays A HREF text instead of the link description. |
|||||||