if I'm using IE only I can get around just fine, but I haven't really had a lot of experience sniffing out other browsers and trying to create different code branches to create the same effect on a particular browser.
In this case I've got a series of layers that correspond to some links. When someone mouses over the link, the layer becomes visible. When someone mouses out, I want the layer to fade out. Code:
This is my code:
Now i want the second layer to appear when i hover over the first, which it does. however i want it so that when i move my cursor away from the second layer it dissapears but the problem is it doesn't seem to work.
I have a script that when you click a link it changes a layer visibility. IE: one layer becomes visible while another hidden.
It works great in NS and IE but when I try it in mozilla(firebird) it won't work. Any have a code I could use or know of a resource where I can get one.
I want to have a single window with 6 or so links at the top that display fixed pages for the first 4 and the final two "Brow" and "se-H" or "se-S". When you double click "Brow" a script prompt asks to enter where they want to go. The script then adds http:// to the front of it and places it as the src for an iframe in a <div></div> layer that has its visibility as hidden. "se-H"/"se-S" Hide and show the layer wich has a zindex higher than that of all other layers on the screen. The other links that just have the code strung out in the onClick action are working just fine as does the Brow link the only resultant error is the "se-H"/"se-S" links they change back and forth indicating the script is running and the outerHTML code is ok but the zindex just isn't changing nor the visibility. I am asking for any suggestions and if I have not included all necessary code please tell me as I only took the pieces I thought may be causing the trouble:
<SCRIPT>
function show()
/*show*/{
fun2.style.visibility='visible'
/*show*/}
function hide()
/*hide*/{
fun2.style.visibility='hidden'
/*hide*/}
var go_to=""
function disp_pop()
/*disp_pop */{
go_to = prompt("Where do you want to go? ","")
/*disp_pop */}
function get_there()
/*get_there */{
if(go_to !="" && go_to!=null)
fun2.outerHTML='<div id=fun2 style="position:absolute; top:55; left:10; z-index:15; overflow:scroll;"><iframe src="http://'+go_to+'" width=475 height=395></iframe></div>'
else
fun2.outerHTML='<div id=fun2 style="position:absolute; top:55; left:10; z-index:15; overflow:scroll;"><iframe src="http://google.com" width=475 height=395></iframe></div>'
fun2.style.visibility='visible'
/*Everyone else back*/
guide.style.zIndex=2;
autoguide.style.zIndex=0;
webmail.style.zIndex=1;
/*Everyone else back*/
/*get there */}
var swap_1 ='<a id=myH4 onclick="this.outerHTML=swap_2;hide();">wse-H</a>'
var swap_2 ='<a id=myH4 onclick="this.outerHTML=swap_1;show();">wse-S</a>'
</script>
The links I am using in the page are as follows
<a href="#" onclick="guide.style.zIndex=2; autoguide.style.zIndex=2; webmail.style.zIndex=3;">Mail</a>
<a href="#" onclick="guide.style.zIndex=1; autoguide.style.zIndex=3; webmail.style.zIndex=2;">TxGuide</A>
<a href="#" onclick="guide.style.zIndex=3; autoguide.style.zIndex=1; webmail.style.zIndex=2;">Guidelines</A>
<A HREF="#" onmouseover="reappear()" onmouseout="disappear()">AuxDetail</A>
<A HREF="#" ondblclick="tada()" onclick="hideit()">Fun</A>
<a onClick='toggleAddress("")'>Refresh</a>
<a id=myH3 ondblclick="disp_pop()" onclick="get_there()">Bro</a>
<a id=myH4 onclick="this.outerHTML=swap_1;show();">wse-S</a>
I am using CSS text-shadow but of course IE doesn't like it. I've looked into some methods for achieving the same effect in IE, but it's not at all the same so I've opted for another method..I'm going to have two layers. In layer1, it will be standard text, shadowed with CSS. I then screenshotted that and will use the resulting jpeg for layer2.I was then planning to find a script that:1. Detects if browser is IE2. If IE, layer2 is visible, layer1 is invisible3. If not IE, layer1 is visible, layer2 is invisibleThe problem is that I can't find a simple script to detect if the browser's IE or not. I can find loads of scripts that check what version of IE someone's using. The version isn't important!
View 5 Replies View Relatedhow to add extra properties to html elements as I was storing data in html attributes. After looking at some others code including Raphael and this addEvent code. [URL] They seem to treat objects just like an array. obj[property] = value; This would have been extremely helpful to know previously as I have needed to be able to include variables in property names - but have resorted to making the whole thing a string and calling exec() on it.
View 2 Replies View RelatedPlease do not take this the wrong way, but rather as a genuine question I have. I do not want to be negative, but the answer to our bug reporthttp[URL]... One of the main reasons we turned to a javascript framework (we used to use prototype before we - migrated to jQuery), is that we wouldn't need to worry about browsers and versions our users use.[URL].. I now notice that I can not rely on jQuery framework for making functions work cross-browser.
In my opinion, if there is an issue with this, shouldn't jQuery intercept and wrap the call to something that does work in Webkit? Again - this is not meant to be negative, but as an end-developer, I think I should be able to rely on same behaviour of all methods provided in the jQuery library, regardless of what browser/version is being used. (or perhaps at least document it in the api docs?)
I created a method for displaying an object's properties:
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?
I'm trying to get the properties for the following objects:
0: [object Object]
1: [object Object]
2: [object Object]
3: [object Object]
This was generated by using the following code:
[Code]...
Since object names can't simply be a number ie(this.oProducts.Product.0), how can I access the object properties in the list above?
I have the following question.
In my code, Ifirstdeclare a GLOBAL property to store all my global var's in, (with already some properties)[code]...
Does the second block of code overrides the first GLOBAL object? Is there a way to push more properties to an existing object using the same pattern?
I would like to display a small html file in a layer (div) when the
mouse goes over a link (<a href="small.html"
onMouseOver="showPop(small.html)").
Which tag should I use in the layer :
<div id="pop"><object data="small.html"></object></div>
OR
<div id="pop"><iframe src="small.html"></iframe></div>
Or maybe is there another solution ?
--of course the file small.html will be different for each link on the
page, that's the job of the showPop() function--
I want my site to be visible by as most browsers/platform as possible.
Layer writing in Netscape. This is pretty straightforward >> However I'm trying to write to a <div> layer within a <div> layer.
My div:
Code:
<div id="blah">
<div id="aight">
</div>
</div>
I'm trying to write to "aight"
How should my code look?
i'd like to know objects properties and/or methods.
saying i do have an object "o" being part of the dom (a div or an ul...)
how could i list (introspection) all the properties and methods attached
to this object ?
i know it is possible in javascript but don't remeber how to ...
Do many programmers remember most of the object properties and methods or do they use IDE or references to find those specific objects. I'm starting to learn Javascript and seeing all the different type of objects available can be depressing. :(
View 2 Replies View RelatedI am fairly familiar with the concept of Objects and their properties and methods, but javascript being object based as opposed to object oriented has me stumped on how to access an object's properties from an onclick event handler created for another object created within the original object.
In the example below, I have a constructor function called anyObj. to which I pass an object reference to an element.
anyObj has 3 properties and one function increaseWidth()
increaseWidth() creates a new button with an onclick event handler and this is where I have a problem.
The onclick function needs to increase the value of anyObj's this.width property. I originally had a line this.width += 10; in the onclick but quickly realised why this wasn't working because the this in the onclick function refers to the new button object and not the this.width property of anyObj.
The workaround I have used, and it works, is to make a copy of all the this.xxxxx properties. eg. width = this.width; and use the width variable in the onclick as you can see below. This "workaround" works fine but doesn't feel ideal to me.
So is there a better way to access the anyObj()'s properties from within the onclick function than the way I have done it? Obviously I would prefer to not have to make copies of all the anyObj() properties like I have to make them accessible to the onclick function.
function anyObj(divObj){
this.elem = divObj;
this.width = 50;
this.height = 50;
[Code]....
Say x in a XML Http Request Object ... meaning it's either XMLHttpRequest (firefox) or ActiveXObject (IE)
This line of code works in firefox...
x.someProp = "someValue";
alert(x.someProp);
But in IE I get "Object doesn't support this property or method" I need to place a custom property on the object. Is there any way I can do that in IE?
I've already tried ActiveXObject.prototype.someProp = "";
I've created an object and within this object, I've added an eventlistener. But the problem now is that after addEventListener is being called to access a callback function, the callback function is not able to access the properties within its own class. Code:
View 14 Replies View RelatedI am fairly familiar with the concept of Objects and their properties and methods, but javascript being object based as opposed to object oriented has me stumped on how to access an object's properties from an onclick event handler created for another object created within the original object.In the example below, I have a constructor function called anyObj. to which I pass an object reference to an element.
anyObj has 3 properties and one function increaseWidth()
increaseWidth() creates a new button with an onclick event handler and this is where I have a problem.The onclick function needs to increase the value of anyObj's this.width property. I originally had a line this.width += 10; in the onclick but quickly realised why this wasn't working because the this in the onclick function refers to the new button object and not the this.width property of anyObj.
The workaround I have used, and it works, is to make a copy of all the this.xxxxx properties. eg. width = this.width; and use the width variable in the onclick as you can see below. This "workaround" works fine but doesn't feel ideal to me.So, what I am asking advice on is, is there a better way to access the anyObj()'s properties from within the onclick function than the way I have done it? Obviously I would prefer to not have to make copies of all the anyObj() properties like I have to make them accessible to the onclick function.
Code:
function anyObj(divObj){
this.elem = divObj;
this.width = 50;
[code]....
I have the empty object and two variables:
[Code]...
Code JavaScript:
function dropdown() {
}; dropdown.prototype = {
sele: $('.select'),
city: [],
scope: [],
type: [],
init: function(json) {
if(json.location.length) {
for(var i=0; i<json.location.length; i++) {
this.city[i] = json.location[i].city; .....
this.scope[i] = json.location[i].scope;
}}.....
getUrl: function() {
return location.pathname+location.search;
},
setUrl: function(paramType, param) {
return this.QueryString(paramType) ? this.setQueryString(paramType, param) : this.getUrl()+"&"+paramType+"="+param;
}};
Well, I've been working with JS for three years and have a great experience here. But! I still have no really acceptable answer to the following
question:
What is the principle difference between declaring methods/properties
in the constructor function body and via prototypes.
Are there any real GURUs? Let's discuss the issue.
In JavaScript 1.5, objects can use special getter and setter functions
[1] for properties. However, these only seem to be implemented in Gecko
and, AFAICT, don't seem to be part of ECMAScript.
Is there an alternative syntax I can use that is standardised in
ECMAScript and also (preferably) interoperably implemented in several
browsers? Or, do I have to use ordinary getFoo() and setFoo() functions. Code:
I want to programmatically list all properties of JS object from C++ code (I am using Mozilla's JSAPI). I know I can go up the prototype chain with JS_GetPrototype, then enumerate each object's own properties with JS_Enumerate.
View 7 Replies View RelatedI have an object: Myobject and properties for the object: Myobject.color, Myobject.width, Myobject.height The scripts returns TRUE if I query Myobject.color or Myobject.width etc. I want to loop through de properties like so:
Code:
var properties = ['color', 'width', 'height']
for (var i=0; i<properties.length; i++) {
Myobject.properties[i]; // Returns UNDEFINED
}
How to make it works? (Should returns TRUE)
I've got an image gallery in which users can navigate between the next and previous image by clicking on the right or left half respectively of the current image. When the mouse is over the left half an arrow pointing to the left is shown on the image and when on the right an arrow to the right. It works fine if i use inline javascript but i'm trying to achieve the same effect unobtrusively and with an addEvent function. The onmouseover part works fine but from the function that fires on the onmouseout event i get the following error in Firefox and the arrow is not hidden:
View 2 Replies View RelatedI don't know why but after the animate() function it's like all the properties get wiped.
PHP Code:
bubble.prototype.expand = function() {
var _this = this;
this.mLeft = parseInt($(this.div).css('margin-left').split('px')[0]);
this.mTop = parseInt($(this.div).css('margin-top').split('px')[0]);
this.iWidth = $(this.iconImg).width();//icons dimensions
this.iHeight = $(this.iconImg).height(); .....