don't worry they want! you've coded for firefox and firefox it gave.
there are two ways of fixing this, you either give your images enough space (width) to fit in that container, or you force style display block on their inline wraper tags, <a> .
could it be the other way around, because if it really happens to be an IE "bug" you should post back at Microsoft -'cause we cant fix browsers.
Why don't you check you code instead of 'repoting bugs' you don't know anything about?
It works fine on my IE 6 - but you should check back the style, (and a bit of positioning) because the border around elements is dashed here while in fx it's solid.
of course, thats because your border doesn't have a color for you to see it, you sould set the bordercolor also. Or assign a previously defined class instead. it keeps things cleaner.
Expired or Illegal copy perhaps?! "Sorry, the Windows 7 RC is no longer available for download. The general release version of Windows 7 will be available on October 22, 2009."
I am trying to put up a rope border (border.png) on the sides of my center box of text. Text will work with z-index properly, but the border just will not show. Any ideas?
<!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>Horseback Adventures</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link href="style.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="central">
<div id="contentborderside">
<p>There should be a rope on either side of this!</p>
</div>
<div id="content">
<h1>Why won't the image show?</h1>
<p>Try as I might I can't get the z-index to work for my border ='( </p>
<p>Any ideas?</p>
</div>
</div>
</body>
The image is attached.
Thank you! -optikali
Some little dumb mistake I'm sure... p.s.: check the little thingy in red inside your code, That's what's missing here.
that works if you see my first post above. i have did the same.
but there you will get issue with font-size which will 70% for body from 70% given to HTML
That's why CSS is invented for. You group select and you divide particulars when needed. So we will split that body of statements in two groups so we drop properties not needed for html to assign only to element that will need them.
that look great. but can you tell me where to set it in? shall it all go to body or???
The topmost code is hard coded html meaning it is html; the second one is a scripting syntax meaning it has to go inside the <script> tag. That line will store reference to the player object in the variable named obj there. Now obj is the public name of the player - from now one you call it "obj" and it will respond.
The rest is scripting handles that you can use to manipulate your player. the most important one is: [your player].URL part. With it you specify the file to play. declaring: obj.URL = "myvideo.wmv" will switch from previous to playing myvideow.wmv file.
SCRIPTING control Code Parameters Description obj.Settings.autoStart true Specifies or retrieves a value indicating whether the current media item begins playing automatically. obj.Settings.baseURL Specifies the base URL used for relative path resolution with URL script commands that are embedded in media items. ClosedCaption.captioningID 0 Specifies the name of the element displaying the captioning. obj.Controls.currentMarker 0 Specifies the current marker number. obj.Controls.currentPosition 0 Specifies the current position in the media item in seconds. obj.Settings.defaultFrame - Specifies the name of the frame used to display a URL. obj.enableContextMenu true Specifies a value indicating whether to enable the context menu, which appears when the right mouse button is clicked. obj.enabled false Specifies whether the Windows Media Player control is enabled. obj.fullScreen false Specifies whether video content is played back in full-screen mode. obj.Settings.invokeURLs true Specifies a value indicating whether URL events should launch a Web browser. obj.Settings.mute false Specifies if audio is muted. obj.Settings.PlayCount 1 Specifies the number of times a media item will play. Minimum value of one. obj.Settings.rate 1.0 Specifies the playback rate. 0.5 equates to half the normal playback speed, 2 equates to twice. obj.stretchToFit false Specifies whether video displayed by the control automatically sizes to fit the video window, when the video window is larger than the dimensions of the video image. obj.uiMode full Specifies which controls …
Thank you very much I understood everything but i still dont understand where "A" came from. Can I use it without "A". if possible help me
The "A" is exactly one or any of these "A"s in the Document! The "A" came from here: <A HREF="next1.html"> <!-- PARENT --> <IMG SRC="images/button1_off.gif" width="113" height="33" alt="button1" id="button1" /> <!-- Its Child --> </A> <!-- Parent closure -->
That check makes sure that only the images wrapped in link elements "A" should receive the rollOver functionality leaving other illustrative images alone.
Hi, there. This is some very old script, rigid and extremely interdependant This script will stop functioning as soon as file naming convention is broken. Meaning that it relies in things not supposed too.
I will try to comment it line by line for you:
<html>
<head>
<title>A More Effective Rollover</title>
<!-- there is nothing, not even vaguely effective about this script! -->
<script>
window.onload = rolloverInit; //calling the rollover handler on load event
function rolloverInit() {//writing the actual rollover function
for (var i=0; i<document.images.length; i++) {//walking through document image collection
if (document.images[i].parentNode.tagName == "A") {
//checking if current image is a child of a link element A - not assigning to it!
setupRollover(document.images[i]);// calling another function that is not written yet, and passing images as functiona arguments successively.
}
}
}
function setupRollover(thisImage) {//here "thisImage" will get the passed as argument to this function earlier.
thisImage.outImage = new Image();//creating e new image element as attribute of current image.
thisImage.outImage.src = thisImage.src;//seting the source of that image to its existing image source to be able to switch back to default.
thisImage.onmouseout = rollOut;// assigning the rollOut function on current image mouseout event.
thisImage.overImage = new Image();// creating another image as attribute of the current as in previous turn.
thisImage.overImage.src = "images/" + thisImage.id + "_on.gif"; //now building and setting the hover image source relative path to folder "images" taking the current image id as a part of the hover image file name and completing it with …
This is a sample of a list I would use. The option value is the value that will be stored with the post. I can't hard code the list because each client can have more, less, and other defined terms. The users maintain the lists in a fully relational database.
I am 99% sure I want a drop-down list - unless there is a better way to allow the end user to select from a list. I thought a drop-down would be the best because I can export/create a list of data from the databases, I just don't know how to take the raw text list and drop it into the HTML code.
The regular application is used for flight dispatch and patient charting for Air Medical helicopters. Our clients want a web front end to do some tasks like scheduling flight requests. With over 130 clients, they each have different ideas of what should be in any given list. The example above is from a list of possible request types.
please write your select list and populate it manually as an example so we can have some idea on what you seek, in fact to have something we can refer (to and from) in our possible explanations that might turn up.
Thanks a lot for the insight and the great examples! Will work on this ASAP.
I will have to mention this forum in the credits :)
Troy you are right, nothing to do with css classes or whatever, I meant two different elements or levels.
Nice I'm puzzled though, why is that code using same id on multiple elements?
And I have another puzzle somebody could answer to me: whose responsibility is to mark threads as solved, :: the thread starter or admins? (!please, I really don't know the answer to this, just curious!)
I have a mootools accordion in the website I'm building that uses two classes: "toggler" for the titles and "element" for the content.
I'm in the need of adding an input field at the bottom of the "element" DIV that the user has opened.
Problem is, every content of every different toggle has the same id="element".
The only difference is that the one opened has the visibility set to "visible".
Is there a way so I can write in that visible DIV from Javascript?
I've underlined some conflicting statements in your problem description, and the clearance on that part might give some strait forward solution.
That is: if explanation stating that elements are using the word "element" as an ID, is just a writing mistake, meaning that the first statement is in fact correct, you could solve your problem by simply adding an unique ID to that element that would enable you to access its properties directly later on.
But if all these elements are really using ID instead of CLASS selector you'll be forced to take another route. And there are lots of them...
And since the visibility property is being set by javascript than javascript will be able to retrieve its value also. So one of the ways to go, would be to write a function that does this:
function getVisibleEl(){
var els = document.getElementsByTagName('div');
for(var i=0; i<els.element.length; i++){
if(els.element[i].style.visibility=="visible" ){
//this is our DIV, write to
els.element[i]
//your planed input …
It is possible that you've confused margins with padding specifications since negative padding is not allowed and people us padding to achieve similar effect quite often and may confuse them. But negative margins are allowed and defined by W3C:
css2.1 box model http://www.w3.org/TR/CSS2/box.html also defined and supported in CSS1 CSS1 box model http://www.w3.org/TR/REC-CSS1 definition sample In the case of negative margins, the absolute maximum of the negative adjoining margins is deducted from the maximum of the positive adjoining margins. If there are no positive margins, the absolute maximum of the negative adjoining margins is deducted from zero.
I have a text box in a form that is validated to accept a value called ds01 but i also want the textbox to be allowed to accept empty spaces that is if nothing is entered in the textbox. The problem is that it does not accept anything other than ds01. Thanx in advance for your help. This is my script
function validate_choice(field,alerttxt) { with (field) { if (value != "ds01") { alert(alerttxt);return false; } else if (value ==null || value == "" || value=="ds01") { return true; } } }
function validate_form(thisform) { with (thisform) { if (validate_choice(webdev, "You Must Enter the Correct Code.Please Enter ds01!.Thank You!")==false) {webdev.focus();return false;} } }
Here you go
function validate_choice(field,alerttxt){
with (field){
if (value ==null || value == "" || value=="ds01"){
return true;
}
else if (value != "ds01"){
alert(alerttxt);
return false;
}
}
}
*the part in red is not needed, but doesn't cause problems...
Troy ... thanks very much for your help, but actually i m very new to javascript, so any change I make to my existing code is not helpin me.. Must be doin some poor mistakes. really dnt knw where to change and wht to change.. totally lost.
Still thanks for ur help
No, no, no change in actual code please - make an addition only.
here are the steps: in this line of code - all you have to do is to ad an ID to that input <td><input type="text" value="0" size = "2" onchange="doAdd(this)" ></td> to become: <td><input id="myInput" type="text" value="0" size = "2" onchange="doAdd(this)" ></td> so you will be able to reference it by its id directly instead of goin through "inputs" collection an determining which one it is so tou can pass it to the object pointer on the function call. You need to tell to the document invoking the function "who "THIS" is".
Than somewhere at the end of your script code add a line like this: var myInput = document.getElementById("myInput"); To finish it and see it finally working - if you are calling your function from the body of the document on load <body onload="doAdd(myInput)"... Nothing more so that the function will know "who this is" and you'll see the result immediately.
Yeahh u r rgt. I get ur point. But I m confused how should I change my javascript function to fit my requirements. Can please help how to change it to fot onload requuirement as well as onchange which is on cell level
<script type="text/javascript">
function getColumnCount()
{
return document.getElementById('myTable').getElementsByTagName('tr')[0].getElementsByTagName('td').length;
}
function getRowCount()
{
return document.getElementById('myTable').rows.length;
}
function doAdd(ths)
{
var lastCol = getColumnCount()-1;
var lastRow = getRowCount()-1;
//for Column Sum
var table = document.getElementById("myTable");
var row = table.rows[ths.parentNode.parentNode.rowIndex];
var colSum=0;
for(var i=0;i<lastCol;i++)
colSum=eval(colSum) + eval(row.cells[i].childNodes[0].value);
row.cells[lastCol].innerHTML = colSum;
//for Row Sum
var cIndex = ths.parentNode.cellIndex;
var rowSum = 0;
for(var i=0;i<lastRow;i++)
rowSum = eval(rowSum) + parseInt(table.rows[i].cells[cIndex].childNodes[0].value);
table.rows[lastRow].cells[cIndex].innerHTML = rowSum;
//for the final Value in the last row last column
var finSum = 0;
for(var i=0;i<lastRow;i++)
finSum = eval(finSum) + parseInt(table.rows[i].cells[lastCol].innerHTML);
for(var i=0;i<lastCol;i++)
finSum=eval(finSum) + eval(table.rows[lastRow].cells[i].innerHTML);
table.rows[lastRow].cells[lastCol].innerHTML = finSum;
}
This is more complicated than that doAdd(this ... turns out to be doAdd(ths)
The "ths" is short for something having to do with the table but I dont understand the h and s part.
So the ths conferteted to function argument through "this" must be the element residing on the Table.
Therefore you must get this element into the function argument for "onload" function call.
The element calling the function is ( as you've mentioned) , the: <td><input type="text" value="0" size = "2" onchange="doAdd(this)" ></td> give it an ID, than reference to it with aforementioned method var myInput = document.getElementById("myInput") do the onload …
Hi Troy. I m calling it onload="doAdd(this)". If this is wrong how should I call it. Even i was confused wht variable should i pass on load inplace of this
"this"? :') "this" what? -what is "this"when called from document object or document body? the function caller, - but you don't want that, you want the exact element on which the function was written for. so you get its reference by document.getElementById type of thing and add it as a variable value replacing the "this" keyword with it.
onload=doAdd(someTableElementYouAreAiming); Refresh the page!
I have a javascript function for calculating sum of values in row and colom of a table. It is using get element by id table name. So is table specific.
I am calling that function every time a value changes in the table by
Bu the problem is I even want to call that fucntion at the very start of the page it as soon as my table loads beacuse it has some existing values from the database. I tried using Onload on table level but nothing happened. I want to know what event should I use for this situation and where should I call it.
Many Thanks.
How are you calling the function during onload event? hopefully not with something like : onload="doAdd(this)" because that's wrong!
Netscape UA children are not capable of recognizing DOM elements by their Names or IDs natively! They'll need externally patched built-in functions attached to Document Object, to become aware of them and be able to reach them. But not without script action. They could trigger this function internally after onload event would fire, but that would impact their render engine, rise more memory issues present and would fail to update DOM changes on runtime because of internal ondomchange event imperfections that would occasionally rise errors like this or that element is "Undefined" even though present.and defined.
Therefore you will be needing a function call "document.getelementById() every time …
of course, "base" argument-value is always the initial given value - according to the function: only the "exponent" should change! "base" is the BASE! There's no practical use if the base number changes.
The values are being kept and passed on function argument variables base & exponent, and the function will call itself until the exponent variable value reaches 0 ending the loop with 1.
Such a small, simple and powerful code deserves admiration :')
no grade yet. its due friday. this is a chalange for me with onyl 2 weeks of js lessons lol. anyway thx for the help.
Good luck than! But you should have told us that the solution: . . . img.onclick=getImgId; . . . function getImgId(){ id = this.id; alert( id ) } . . . works!
hi i don't know it is wright place for it or not. i am new in javascript programming. i am try to implement find and replace functionality. in it i want to search keyword in particular div only. not other part of the page. i have implement following code . . . i am facing one problem in it, that when div innerhtml is like "this is test <font>string</font>." and search for "string." it will fail and show string like this "this is test <font>string/font>." so anybody help me which changes i have to do in my code to remove this bug thanks for help
For Firefox, use: [B].texContent[/B] or for crossbrowser cure the innerHTML string with [B]str2search = targetElement.innerText||targetElement.textContent[/B]
Any ideas? Should I develop for Firefox, then try and fix for IE? Or, the other way around?
Thanks in advance,
Mapper
Yeah, it looks as it should on IE.
All container elements are broken in Netscape based browsers. This is known as a bleeding fox syndrome bug, or "fox on fire behaviour". It will drop everything out of it container. You'll be forced to manually set the height of each container element so it'll look as if its holdin it.
The div id=search will need the height of exactly 20px.
The div id=search2 will need the height of at least 22px.
The div id=top of the class=section will need the minimum height of 160px.
The div id=middleedit of class=section will need the height of 512px.
The div id=middle of class=section will need the same height of 512px. ! and try floating it too.
This should fix it. Just remember that containers act as if they're inline elements in Netscape children too.
i changed my code a bit to using event listeners but i still cant get the Id to appear in the alert i get either HTMLElement or something like that in the alert or i get an empty alert box anyone know what im doing wrong?.
sorry for double post but i couldnt edit my first one.
function vulpagina() {
var maindiv=document.getElementById("maindiv");
for(i=0; i<26; i++){
var imgnr = i;
var div=document.createElement("div");
var img=document.createElement("img");
var br=document.createElement("br");
var txt=document.createTextNode("dit is div " + i);
img.src=album[imgnr].url;
img.style.margin ="10px";
img.style.padding ="10px";
img.style.height="80%";
img.onclick=getImgId;
div.setAttribute("id","divje" + i);
div.appendChild(img)
div.setAttribute('style','float:left');
div.style.width="20%";
div.style.height="20%";
div.appendChild(br);
div.appendChild(txt);
maindiv.appendChild(div);
}
}
function getImgId(){ id = this.id; alert( id ) }
Hmm but document.execCommand with "bold", 'underline' and 'italics' work in FF.
Anyway... if you could point me in the right direction as to how to create a link in FF I'd appreciate. Just a hint will be enough :)
For as far as I know it doesn't, where did you see that? :') [in firefox it's only possible in recently adopted 1997 IE technology "contentEditable" mode turned On, not in normal view mode. ]
No, I can't point you to any direction or give you a hint or anything of that sort
But what I can do, is to give you my original code that will also work in FX right? :')
(FX, Opera and IE tested, -please test it in other browsers and report any eventual problems you might find).
Here is the code:
<html>
<head>
<title>Text to Hyperlink</title>
</head>
<body>
<h1>Create a link</h1>
Select some text and click the button. The selected text will become the named hyperlink<br>
My Homepage<br>
My Favorite<br>
My Search Page<br><br>
<button onclick="createLink(event)">Make it a link</button>
<script>
function createLink(e){//b.b. Troy III p.a.e.
if(e.target){ //get ATL
var a = window.getSelection().getRangeAt(0);
var b = a.toString();
var z = document.createElement("span");
var l2 = prompt("Enter URL:", "http://");
b = b.link(l2);
z.innerHTML=b;
a.deleteContents();
a.insertNode(z) }
else{ //get the ATW
document.execCommand("CreateLink") }
}
</script>
</body>
</html>
Note: to shorten the ATL method and gain some efficiency, I've used some widely compatible DOM0,1 methods.
<head>
<TITLE>Creating a link</TITLE>
<SCRIPT LANGUAGE="JavaScript">
<!--
function createLink()
{
var szURL = prompt("Enter a URL:", "http://");
if ((szURL != null) && (szURL != "")) {
document.execCommand("CreateLink",false,szURL);
}
}
// -->
</SCRIPT>
</HEAD>
<BODY>
<H1>Creating a link</H1>
Here's some text. Select some and click the button to turn it into a hyperlink.
<BR />
<BUTTON ONCLICK="createLink()">Click to create the link</BUTTON>
</body>
</html>
It's working ok in IE, but in Firefox (3.5.3 I'm using), I get the following error:
I have googled for this error but seems nobody is having problems with it? Any help much appreciated, I'm a rookie in javascript.
(line 11 is the CreateLink line)
That's because firefox is not capable of executing this or any other commands associated with document.exec !
Hi, I'm new to the forum and have just come across this issue when testing my site for the first time in Internet Explorer (I normally use Firefox). In IE, the 3x3 table renders with the two images in Row 3, Col 1 and Row 3, Col 3, both sized as 1px by 1px with a gap below them, showing the background colour through.
See attached screenshots, the first of Firefox's (correct) and the second of IE7's (incorrect) rendering.
The HTML code is as follows:
Please help me to get the IE rendering the same as FF's!
Thanks in advance,
J
What's so "correct" about FX there. All I see is that you are asking from IE to render a bug.
Hi Thanks to all My problem is when onmouseover the image is changing but after mouseout image have to return to its backstage. but it is not returning to backstage. the onmouseover event image is setting up. however I resolved the problem by setting up the onmouseover events to anchor tag. Thankyou
Yes that should break the recursive mouseover rising event, but what about second mouseover? That is: after the mouseout event has taken place? It will most probably die. Of course if you don't write the event handler along with the innerHTML of the element you've changed, that is.
