Learn VBA & Macros in 1 Week!

JavaScript - Accessing Css Properties Issue

Full Excel VBA Course - Beginner to Expert

Accessing Css Properties Issue	View Content

I have developped a script in order to resize the height of a div on a web page in order to display it at least up to the size of the window. Here is the code:

function resize(){
var frame = document.getElementById("content");
var padding_top = parseInt(window.getComputedStyle(frame,null).getPropertyValue("padding-top"));
var padding_bottom = parseInt(window.getComputedStyle(frame,null).getPropertyValue("padding-bottom"));
var padding = padding_top + padding_bottom;
var bodyheight = document.body.scrollHeight;
var windowheight = window.innerHeight;
if (bodyheight < windowheight){
frame.style.height = windowheight - padding + "px";
}
}

It works well, but I was wondering why I am not able to get the padding-top and -bottom using these two instructions:

var padding_top = frame.style.paddingTop;
var padding_bottom = frame.style.paddingBottom;

The script runs but Firebug shows empty strings for both values. How come? Is there a bug in Firefox?

Thanks inadvance for your time and help.

Full Excel VBA Course - Beginner to Expert

Javascript - Accessing Object's Internal Properties

Similar Tutorials

View Content

Hello everyone,

I 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;
                this.height = 50;
                this.increaseWidth=function(){
                    width = this.width;
                    height = this.height;
                    //create a button for this object to be appended to an element later on
                    var newButton = document.createElement('button');
                    newButton.onclick=function(){
                        width += 10;
                        //...
                        //...
                    }
                    //...
                    //...
                }
            }

How To Hide The Url From Staus Bar And Properties(right Click Properties)

Similar Tutorials

View Content

Hi Experts here,
Pls help.

I have written the html code like this:

<a href="http://mypage.com/docfiles" target="_blank"> Click </a>

But the problem is when ever the user click the click option complete url is displaying in two ways

1)on the buttom of the status bar

2)Right click on the option open the properties than also we are getting the complete url.

But we don't want to see the complete url,How to hide the Url.

Please give me solution I am struggling alot.

Thanks and Regards,
Srinivas yadav.

please Look At These Properties And Methods & Changing Properties

Similar Tutorials

View Content

I HAVE BEEN TRYING TO FIGURE OUT THE PARAMETERS IN THE FUNCTIONS, INCLUDING THE ARRAYS [i], [p], ["get_" + i], ["set_" + i] AND HOW THE METHODS ARE BEING CALLED IN RELATION TO i, p and val, so that I can make sense of this code. If possible can you explain the code also

What I will like to know are the properties and methods of the objects generated in the following code?

Also I want to know how I can use those methods to show and change the name and age for the emp2 object.

this is the code:

function Employee(properties) {
for (var i in properties) {
if (properties.hasOwnProperty(i)
&& typeof properties[i] != 'function')
{
this["get_"+i] = (function(p) {
return function() { return properties[p]; };
})(i);
this["set_"+i] = (function(p) {
return function(val) { properties[p] = val; };
})(i);
}
}
}

var emp1 = new Employee({ name: "Bob", age: 35, foo: function() {} });
var emp2 = new Employee({ name: "Gary", age: 54 });

Why Offsetxxx Properties Are All Zero ?

Similar Tutorials

View Content

Hi,

I've done control in asp.net/javascript and it works on some pages of mine and as it often happens doesn't work on customer's pages .
All pages are run in IE 6.0.
After I run debugger I've found out that on my page offsetLeft/Top clientHeight properties have some non-zero values.
I have <span id="listCLient" style="width:200px;">..</span> and on my test page elListClient.clientHeight = 200, but on customer's app's page it is 0x0 ?
Same with other offsetXXX properties etc.
But elListClient.style.height bears correct value.
I use those properties everywhere.

I think it is some settings somewhere ? or CSS styles ?
Can anyone help ?

Thanks a lot

Vladislav

Showmodaldialog With Overlay Properties

Similar Tutorials

View Content

Hi,

I want to a javascript function like showModalDialog(<page_name>,'','<options>')

here in the option I need to have overlay property where I can set opacity values.

Is there any solution? Please letme know

Objects, Their Properties, And A Little Cleanliness

Similar Tutorials

View Content

Hello. I'm Ansem717 and I've been honestly coding Javascript since August; however, I have learned and coded a few things a couple years ago. I'm not a master at Javascript, but I can follow along what most people say or code. I decided to test my skill in coding, by making a text-based RPG game via Javascript.

Now that I've introduced my background information about JS coding, I'd like some of you to help me out with the following code: (It's fairly big, but skip it to see the actual content.)

PHP 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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Text Based</title>
<link rel="stylesheet" href="ssgame.css" media="screen" />
<script type="text/javascript">
// JavaScript Document

var d=document;                //Easy shorthand
var inventoryWeight=500;    //Inventory cannot be heavier than 500 'units'
var inventoryMaximum=30;    //Inventory cannot have more than 30 items
var n='\n';                    //Line break for Game screen
var nts=n+"   ";            //Line break for game screen plus three spaces for formating. I'm lazy like that XD
var presentRoom=0;
var player=null;
var objectsInRoom=null;
var allOptions="SELF INFO__LOOK AROUND__WALK NORTH__WALK SOUTH__WALK WEST__WALK EAST__ATTACK__TALK__PICKUP__DROP__INVENTORY";

function get(id) {
    return d.getElementById(id);
}

function gameSCRN(msg,overwrite,linebreak) {
    if (linebreak==1) var val = d.tb.gamescreen.value+n;
    if (linebreak==2) var val = d.tb.gamescreen.value+n+n;
    else var val = d.tb.gamescreen.value;
    d.tb.gamescreen.value = (overwrite!=1) ? val+msg : msg;
    d.tb.mymove.value="";
    d.tb.myname.value="";
}

////////////////////////////////
//SET ITEMS, NCPS, AND PLAYERS//
////////////////////////////////

function Obj(name, health, strength, defense, speed, weight){
    this.name = name;
    this.hp = health;
    this.str = strength;
    this.def = defense;
    this.spd = speed;
    this.wgh = weight;
}

var items=new Array();

items[0]=new Array();//ENEMY
items[0][0]=new Obj('Kid Goblin', 5, 3, 2, 1)
items[0][1]=new Obj('Adult Goblin', 15, 6, 4, 3)

items[1]=new Array();//WEAPON
items[1][0]=new Obj('Dagger', 0, 2, 0, -1, 5)
items[1][1]=new Obj('Ax', 0, 7, 0, -2, 9)

items[2]=new Array();//ARMOR
items[2][0]=new Obj('Cloth Shirt', 0, 0, 3, 3, 1)
items[2][1]=new Obj('Chainmail', 0, 0, 8, -1, 15)

/////////////
//SET ROOMS//
/////////////

function room(name,actions,objectsInRoom,defaultTxT) {
    this.name = name
    this.text = defaultTxT;
    this.actions = (actions&&actions!=0) ? actions.split("__") : "There are no actions present in this room";
    this.objects = (objectsInRoom&&objectsInRoom!=0) ? objectsInRoom.split("__") : "There are no objects present in this room";
}

var rooms=new Array();
rooms[0]=new room("clearing","SELF INFO__LOOK AROUND__WALK NORTH__WALK WEST__WALK EAST__WALK SOUTH__DROP",0,player.name+" is stranded in a clearing.")
rooms[1]=new room("goblin hideout","SELF INFO__LOOK AROUND__WALK SOUTH__ATTACK__TALK__DROP",items[0][0]+"__"+items[0][1],player.name+" has approched a goblin hideout!")
rooms[2]=new room("weaponry","SELF INFO__LOOK AROUND__WALK WEST__PICKUP__DROP",items[1][0]+"__"+items[1][1],player.name+" is inside a weaponry! Weapons increase "+player.name+"\'s strength, but may decrease his speed. Another thing to account for is "+player.name+"\'s inventory and weight. It's not like "+player.name+"\'s inventory has no end.")
rooms[3]=new room("armory","SELF INFO__LOOK AROUND__WALK NORTH__PICKUP__DROP",items[2][0]+"__"+items[2][1],player.name+" is in an armory! Armor increases "+player.name+"\'s defence, but may decrease, or even increase, his speed. Another thing to account for is "+player.name+"\'s inventory and weight as well as the Armor's weight. It's not like "+player.name+"\'s inventory has no end.")
rooms[4]=new room("empty room","SELF INFO__LOOK AROUND__WALK EAST__DROP",0,player.name+" has noticed a sign that says, \"No one may enter.\" Behind the sign, there is a large barbed fence that "+player.name+" cannot penetrate.")

//////Actual Content

function gameStart() {
    d.tb.gamescreen.value=" ";
    gameSCRN('First thing is first. Name yourself! At the bottom, there should be a small box you can type into. Type your name into that box.',1,1);
}

function nameSelf() {
    var name=d.tb.myname.value;
    player=new Obj(name, 100, 0, 0, 5);
    gameSCRN(n+"Hello there "+player.name+"!"+n+n+"In a couple of seconds, the game will begin.");
    get("name").style.display="none";
    get("act").style.display="block";
    setTimeout(function(){ActualGameStart();},5000)
}

function ActualGameStart() {
    presentRoom=0
    visualizeRoom();
}

function visualizeRoom() {
    gameSCRN(rooms[presentRoom].text,1,0);
    if (rooms[presentRoom].actions!="There are no actions present in this room")
    {
        for (i=0; i<rooms[presentRoom].actions.length; i++)
        {
            gameSCRN(rooms[presentRoom].actions[i],1,0);
        }
    }
    else
    {
        gameSCRN(rooms[presentRoom].actions,1,0);
    }
}

//The below functions have been commented out because I had an idea. I didn't want these to collide, and since that idea is almost complete, I'm keeping these incase I need to take some of the below and scatter them up top.

/*function PreformAction() {
    var dsmv=d.tb.mymove.value.toUpperCase();
    var cnotdsmv="You cannot "+dsmv+" at this moment.";
    if (dsmv==diffOptions[0])
    {
        if (room==1) {gameSCRN(player.name+" "+dsmv+" but doesn't seem to find anything",0,2);} //Center room
        if (room==2) {gameSCRN("room==2",0,2);} //Northern Room
        if (room==3) {gameSCRN("room==3",0,2);} //Eastern
        if (room==4) {gameSCRN("room==4",0,2);} //Southern
        if (room==5) {gameSCRN("room==5",0,2);} //Western
    }
    else if (dsmv==diffOptions[1])
    {
        if (room==1) {gameSCRN(player.name+" "+dsmv+" into room 2. Add extra functions and karp here.",0,2);}
        if (room==2) {gameSCRN(cnotdsmv,0,2);}
        if (room==3) {gameSCRN(cnotdsmv,0,2);}
        if (room==4) {gameSCRN(player.name+" "+dsmv+" into room 1.",0,2);}
        if (room==5) {gameSCRN(cnotdsmv,0,2);}
    }
    else if (dsmv==diffOptions[2])
    {
        if (room==1) {gameSCRN(player.name+" "+dsmv+" into room 4. Add extra functions and karp here.",0,2);}
        if (room==2) {gameSCRN(player.name+" "+dsmv+" into room 1.",0,2);}
        if (room==3) {gameSCRN(cnotdsmv,0,2);}
        if (room==4) {gameSCRN(cnotdsmv,0,2);}
        if (room==5) {gameSCRN(cnotdsmv,0,2);}
    }
    else if (dsmv==diffOptions[3])
    {
        if (room==1) {gameSCRN(player.name+" "+dsmv+" into room 5. Add extra functions and karp here.",0,2);}
        if (room==2) {gameSCRN(cnotdsmv,0,2);}
        if (room==3) {gameSCRN(player.name+" "+dsmv+" into room 1.",0,2);}
        if (room==4) {gameSCRN(cnotdsmv,0,2);}
        if (room==5) {gameSCRN(cnotdsmv,0,2);}
    }
    else if (dsmv==diffOptions[4])
    {
        if (room==1) {gameSCRN(player.name+" "+dsmv+" into room 3. Add extra functions and karp here.",0,2);}
        if (room==2) {gameSCRN(cnotdsmv,0,2);}
        if (room==3) {gameSCRN(cnotdsmv,0,2);}
        if (room==4) {gameSCRN(cnotdsmv,0,2);}
        if (room==5) {gameSCRN(player.name+" "+dsmv+" into room 1.",0,2);}
    }
}*/

/*function displayOptions(objects) {
    if (objects=="none")
    {
        gameSCRN(n+n+"OPTIONS:",0,1)
        gameSCRN(nts+diffOptions[0],0,0)
        gameSCRN(nts+diffOptions[1],0,0)
        gameSCRN(nts+diffOptions[2],0,0)
        gameSCRN(nts+diffOptions[3],0,0)
        gameSCRN(nts+diffOptions[4],0,0)
    }
}*/
</script>
</head>
<body>
<center>
<h1>Text-Based Game Name Coming Soon</h1>
<form name="tb" id="tb">
<textarea id="gamescreen" name="gamescreen" cols="67" rows="20" onfocus="blur()"></textarea><br /><br />
<div id="act">
What do you do?<br />
<input type="text" id="mymove" name="mymove" /><br />
<input type="button" id="wdyd" name="wdyd" value="Preform action!" onclick="PreformAction()" />
</div>
<div id="name">
What do you do?<br />
<input type="text" id="myname" name="myname" /><br />
<input type="button" id="namebtn" name="namebtn" value="Preform action!" onclick="nameSelf()" />
</div>
</form>
</center>
</body>
<script type="text/javascript">
//Initiate functions
gameStart();
</script>
</html>

Sorry It's so large. I'm have a major bug and it's getting in my way. It has to do with the rooms objects. As you can see I set a new array to have the ability to create rooms on the spot and each of the rooms contacted the function of creating an object.

PHP Code:
function room(name,actions,objectsInRoom,defaultTxT) {
    this.name = name
    this.text = defaultTxT;
    this.actions = (actions&&actions!=0) ? actions.split("__") : "There are no actions present in this room";
    this.objects = (objectsInRoom&&objectsInRoom!=0) ? objectsInRoom.split("__") : "There are no objects present in this room";
}

var rooms=new Array();
rooms[0]=new room("clearing","SELF INFO__LOOK AROUND__WALK NORTH__WALK WEST__WALK EAST__WALK SOUTH__DROP",0,player.name+" is stranded in a clearing.")
rooms[1]=new room("goblin hideout","SELF INFO__LOOK AROUND__WALK SOUTH__ATTACK__TALK__DROP",items[0][0]+"__"+items[0][1],player.name+" has approched a goblin hideout!")
rooms[2]=new room("weaponry","SELF INFO__LOOK AROUND__WALK WEST__PICKUP__DROP",items[1][0]+"__"+items[1][1],player.name+" is inside a weaponry! Weapons increase "+player.name+"\'s strength, but may decrease his speed. Another thing to account for is "+player.name+"\'s inventory and weight. It's not like "+player.name+"\'s inventory has no end.")
rooms[3]=new room("armory","SELF INFO__LOOK AROUND__WALK NORTH__PICKUP__DROP",items[2][0]+"__"+items[2][1],player.name+" is in an armory! Armor increases "+player.name+"\'s defence, but may decrease, or even increase, his speed. Another thing to account for is "+player.name+"\'s inventory and weight as well as the Armor's weight. It's not like "+player.name+"\'s inventory has no end.")
rooms[4]=new room("empty room","SELF INFO__LOOK AROUND__WALK EAST__DROP",0,player.name+" has noticed a sign that says, \"No one may enter.\" Behind the sign, there is a large barbed fence that "+player.name+" cannot penetrate.")

In the above code, I'm creating various objects following under the variables rooms[0] to rooms[4], yea?. At the very beggining of the whole RPG game, it brings up some text saying name yourself in the input box below. After you do that, it adds more text to a textarea 'reminding' you of what your name was. The game then is supposed to start right after that, but thats when we run into these functions, on which counteract with the variabled rooms above:

PHP Code:
function gameStart() {
    d.tb.gamescreen.value=" ";
    gameSCRN('First thing is first. Name yourself! At the bottom, there should be a small box you can type into. Type your name into that box.',1,1);
}

function nameSelf() {
    var name=d.tb.myname.value;
    player=new Obj(name, 100, 0, 0, 5);
    gameSCRN(n+"Hello there "+player.name+"!"+n+n+"In a couple of seconds, the game will begin.");
    get("name").style.display="none";
    get("act").style.display="block";
    setTimeout(function(){ActualGameStart();},5000)
}

function ActualGameStart() {
    presentRoom=0
    visualizeRoom();
}

function visualizeRoom() {
    gameSCRN(rooms[presentRoom].text,1,0);
    if (rooms[presentRoom].actions!="There are no actions present in this room")
    {
        for (i=0; i<rooms[presentRoom].actions.length; i++)
        {
            gameSCRN(rooms[presentRoom].actions[i],1,0);
        }
    }
    else
    {
        gameSCRN(rooms[presentRoom].actions,1,0);
    }
}

As you can see, we have the starting function which is initiated after all of the HTML elements load, then we have the "nameSelf()" function which creates the player as well as sets the timeout for the actual game.

The main error code is right he gameSCRN(rooms[presentRoom].text,1,0); and in both IE and Firefox, the script doesn't continue. It doesn't preform the "gameSCRN()" function. In IE, I'm able to click on something that shows me errors within the browser. The Error IE presented: 'rooms[...].text' is null or not an object. What does this mean? I remember setting 'rooms[0].text' to have a string value, and I did do some debugging, 'rooms[0].text' does return with the apropreate value, as well as, 'rooms[presentRoom].text' does too. They just won't work in the above function?

I have searched your forums, very good codes out there, but I have not found something concrete that can fix this bug. I'd be really grateful for your help as well as some hints and tips on Javascript coding, since I would also like some help on cleaning up my javascript.

And no, I am not taking any programming courses, however much I wish I am. Thanks in advanced!

--Regards,
--Ansem717

Getting All Properties Of An Itunes Object?

Similar Tutorials

View Content

I'm not sure I phrased the question properly and it's probably easiest to show what I'm trying to get. Basically, I want to find all the properties(?) available for a single track object in iTunes.

For example, this is how I access what's stored as the Album and Artist for a track:
Code:

var myTracks = myPlaylists(1).Tracks;
alert(myTracks(1).Album);
alert(myTracks(1).Artist);

There are a ton of properties (like Album and Artist), but I don't know what they all are, so I was trying to list them like this, but it doesn't work:
Code:

for(var key in myTracks(1))
 alert(key);

It's probably obvious why this doesn't work, but does anyone know how to get this list?

Thanks for any help!

Array's Native Properties

Similar Tutorials

View Content

Is there a way to circle trough the native properties (constructor, prototype, length) of an Array object? Obviously, a simple for(a in array) won't do the trick.

Need Help Accessing Object

Similar Tutorials

View Content

Hello,

I have a multi-dimensional object, derived from JSON returned by the Foursquare API. The object has the following structure (as printed using a print_r type method from http://www.openjs.com/scripts/others...hp_print_r.php

PHP Code:
    '0'
        'id' => "27110xxx"
        'created' => "Sun, 11 Apr 10 15:09:45 +0000"
        'timezone' => "America/New_York"
        'user' ...
            'id' => "48xxx"
            'firstname' => "Barry"
            'lastname' => "xxx"
            'photo' => "http://playfoursquare.s3.amazonaws.com/userpix_thumbs/4abb5bxxxxxx.jpg"
            'gender' => "male"
        'display' => "xxxx. @ [off the grid]"
    '1' ...
        'id' => "2538xxxx"
        'created' => "Wed, 07 Apr 10 13:24:41 +0000"
        'timezone' => "Europe/London"

Could anyone tell me the best way to access its elements? I have this so far which gets the required values, but I want to preserve the order ie. get the data from the first element in the object first, then move to the next - each element represents a user so I want to keep their data separate.

PHP Code:
/* This is a custom function which has the same function as print_r */
    function dump(arr,level) {

        var firstName, lastname, geolat, geolong, photo;

        var dumped_text = "";
        if(!level) level = 0;

        //The padding given at the beginning of the line.
        var level_padding = " ";
        for(var j = 0; j < level + 1; j++) level_padding += "    ";

        if(typeof(arr) == 'object') { //Array/Hashes/Objects
            for(var item in arr) {
                var value = arr[item];

                if(typeof(value) == 'object') { //If it is an array,
                    dumped_text += level_padding + "'" + item + "'\n";
                    dumped_text += dump(value,level + 1);
                } else {
                    dumped_text += level_padding + "'" + item + "' => \"" + value + "\"\n";
                }

                if (item == 'firstname')   {
                    firstname = value;
                    document.write("First name: " + firstname + "<br />");
                    document.write(item);
                }

                if (item == 'lastname')   {
                    lastname = value;
                    document.write("Last name: " + lastname + "<br />");
                    document.write(item);
                }

                if (item == 'geolat') {
                    geolat = value;
                    document.write("Latitude: " + geolat + "<br />");
                    document.write(item);
                }

                if (item == 'geolong')  {
                    geolong = value;
                    document.write("Longitude: " + geolong + "<br />");
                    document.write(item);
                }
            }
        } else { //Stings/Chars/Numbers etc.
            dumped_text = "===>"+arr+"<===("+typeof(arr)+")";
        }
        return dumped_text;
    }

    var myObj = <?php echo json_encode($checkin); ?>;

    alert(dump(myObj));

Sorry for the bloated code, I normally work in Java and PHP so although I understand the theory, I haven't worked with objects much in JavaScript before. Any help would be much appreciated!

Javascript While Accessing Ul And Li

Similar Tutorials

View Content

hy all, I am creating an accordion menu that when i press the " UNIT " tab, it opens up a list of " Chapters " tab, and when i press on any one of those chapters, a list of lessons opens up. Till now, i have managed to create all the appropriate lists, but in default, lessons and chapters are opened automatically, and the lessons elements when pressed do not scroll back up to the chapters parents. My html5 file:
Code:

<script type="text/javascript" src="jqueryjs.js"></script>
<script type="text/javascript" src="jqueryuiaccor.js"></script>
<script type="text/javascript">
    $(document).ready(function() {
        $('#accordion').accordion();
    });
</script>

<div id="container">
<div id="content">
<div id="sidebar">
        <ul id="accordion">
            <li>
                <a href="#recent" class="heading">Unit 1</a>    
                    <ul id="accordion">             
                        <li> <a href="#recent" class="heading">Chapter 1 </a> </li>
                                <ul id="accordion2">
                                    <li> Lesson 1 </li>
                                </ul>
                    </ul>
                    </li>
                    <li>
                    <a href="#recent" class="heading">Unit 2</a>    

                    <ul id="accordion">             
                        <li> <a href="#recent" class="heading">Chapter 1 </a> </li>
                                <ul id="accordion">
                                    <li> <a href="#recent" class="heading" role="tab" aria-expanded="true">Chapter 2 </a>
                                        <ul id="accordion">
                                            <li> <a href="#recent" class="heading">Lesson 1 </a></li>
                                        </ul>
                                    </li>
                                </ul>
                    </ul>
            </li>
        </ul>       
    </div>
    </div>
</div>

My acorjs.js file:

Code:

$(document).ready(function() {
    $('ul#accordion a.heading').click(function() {
        $(this).css('outline','none');
        if($(this).parent().hasClass('current')) {
            $(this).siblings('ul').slideUp('slow',function() {
                $(this).parent().removeClass('current');
                $.scrollTo('#accordion',1000);

            });
        } else {
            $('ul#accordion li.current ul').slideUp('slow',function() {
                $(this).parent().removeClass('current');
            });
            $(this).siblings('ul').slideToggle('slow',function() {
                $(this).parent().toggleClass('current');
            });
            $.scrollTo('#accordion',1000);

        }
        return false;

    });

});

Please HELP!

I Can’t Pass Properties To Function

Similar Tutorials

View Content

Remembering Object Properties And Methods

Similar Tutorials

View Content

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.

Cloning Object And I Can't Override Properties, Why?

Similar Tutorials

View Content

I have something like this

var oneTest = new CustomObj({
prop1 : 'value1',
prop2 : 'value2',
prop3 : 'value3'
})

var twoText = Object.clone(oneTest)
twoText.prop2 = "newvalue2"

And when I console log twoText I see something like

+Data
prop2

Inside Data is a prop2 that has the value of "value2". THAT is the one I want to change/override... yet the console shows me that the prop2 is outside of the data structure so when I am acting on the cloned obj I am not getting the results i need.

I tried obj.extend etc.... and that didn't work, perhaps my syntax was wrong. Any advice?

Php And Js (mouseover Conflict) And Table Properties

Similar Tutorials

View Content

An If Statement With Check Target Properties

Similar Tutorials

View Content

Not sure if I even ask correctly. Excuse the poor PHP man for not knowing javascript. I need to add a check to this code.

It picks up an image when you click on it, then puts it down when you click again.

What it needs is another check WHERE (on what) have you clicked to put it down. If it's a particular DIV then OK. If not (if elsewhere) don't put it down and don't change the click counter.

Code:

<html>
<head>
    <style type="text/css">
        .drag
        {
            position: relative;
            height:56px;
            width:56px;
            background-color:#FF0000;
            color:White;
        }
    </style>

    <script type="text/javascript">
        
        var _startX = 0;            // mouse starting positions
        var _startY = 0;
        var _offsetX = 0;           // current element offset
        var _offsetY = 0;
        var _dragElement;           
        var _oldZIndex = 0;         // we temporarily increase the z-index during drag
        var _debug;    
        var _countClick = 0;
        InitDragDrop();
        function InitDragDrop() {
            document.onclick = OnMouseClick;
            document.onMouseClick = OnMouseClick;    
        }

        function OnMouseClick(e) {
            debugger;
            _debug = $('debug');
            // if first click this is zero
            if (_countClick == 0) {
                // IE
                if (e == null)
                    e = window.event;

                // IE uses srcElement, others use target
                var target = e.target != null ? e.target : e.srcElement;

                _debug.innerHTML = target.className == 'drag'
        ? 'draggable element clicked'
        : 'NON-draggable element clicked';

                // 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 = ExtractNumber(target.style.left);
                    _offsetY = ExtractNumber(target.style.top);

                    // bring the clicked element to the front while it is being dragged
                    _oldZIndex = target.style.zIndex;
                    target.style.zIndex = 10000;

                    // set _dragElement for next click
                    _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; };
                    
                    //set click count to 1 so we know next click is to release
                    _countClick = 1;
                    // prevent text selection (except IE)
                    return false;
                }

            }

            if (_countClick == 1) {

                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;

                    _debug.innerHTML = 'mouse up';
                }
                
                //set click count back to 0 so next we know it's first click again
                _countClick = 0;
            }

        }

        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';

            _debug.innerHTML = '(' + _dragElement.style.left + ', ' +
        _dragElement.style.top + ')';
        }

        function ExtractNumber(value) {
            var n = parseInt(value);

            return n == null || isNaN(n) ? 0 : n;
        }

        // this is simply a shortcut for the eyes and fingers
        function $(id) {
            return document.getElementById(id);
        }

        function OnMouseUp(e) {

        }
    </script>

</head>
<body>

    <div id="thediv" class="drag" style='background: url(shield.gif) no-repeat center top;'></div>
    <pre id="debug"> </pre> 
    
    <div id="slot1" class="dropon" style='position: absolute; height:28px; width:28px; top: 200px; left: 200px; background-color:#FF0000; color:White;'></div>
    <div id="slot2" class="dropon" style='position: absolute; height:28px; width:28px; top: 200px; left: 230px; background-color:#FF0000; color:White;'></div>

</body>
</html>

Trouble Working With Custom Properties

Similar Tutorials

View Content

> 1. The fifth cell contains a drop-down selection list for the quantity of items ordered as the first child node of the table cell.
> Store the reference to this selection list in the variable
> `qtySelect`.
> 2. Store the value of the selected option in the `qtySelect` object in the `newItem`'s `qty` property.
> 3. Associate each selection list with a particular store item (you must do this because the table contains 13 different selection lists;
> one for each store item) by adding a custom property to `qtySelect`
> named `currentItem`, and set it equal to the `newItem` variable.
> 4. Add an `onchange` event handler to `qtySelect` that sets the `qty` property value of the `currentItem` property to the value of the
> selected option in the `qtySelect` selection list.

----------

I need help setting up the currentItem property so that newItem.qty updates properly when a different selection is made.

function storeItem() {

this.pid;
this.descr;
this.price;
this.qty = 1;
}

function startShopping() {

var tbody = document.getElementById("saltItems").tBodies[0];
var rows = tbody.rows;
for (var i = 0; i < rows.length; i++) {
var newItem = new storeItem();
var cells = rows[i].cells;
newItem.pid = cells[0].innerHTML;
newItem.prod = cells[1].innerHTML;
newItem.desc = cells[2].innerHTML;
newItem.price = cells[3].innerHTML;
var selID = newItem.pid+"Qty";
var qtySelect = document.getElementById(selID);
var index = qtySelect.selectedIndex;
newItem.qty = qtySelect.options[index].value;
}
}

example of one of the table rows:

<tr>
<td>FSSPJ11</td>
<td>Fine Sea Salt</td>
<td>Plastic Shaker Jar (11 oz.)</td>
<td class="price">$4.15</td>
<td><select id="FSSPJ11Qty">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
<option value="8">8</option>
<option value="9">9</option>
<option value="10">10</option>
</select>
</td>
<td class="cartAdd"><input type="checkbox" id="FSSPJ11" /></td>
</tr>

Does The In Operator Work On Function Properties?

Similar Tutorials

View Content

I'm still learning js core using Flanagan's 5th ed.
so please bear with me; is the if ("ignore" in arguments.callee) return;
below valid or a typeo?
Thanks J.
Code:

function inspect(inspector, title) {
    var expression, result;

    // You can use a breakpoint to turn off subsequent breakpoints by
    // creating a property named "ignore" on this function.
    if ("ignore" in arguments.callee) return;
.......

Nested Methods And Properties In Javascript

Similar Tutorials

View Content

Hi all! I'm pretty new to JavaScript and completely new to this forum. I'm James.

Well uh, I'm not sure how to...

I wanted to make something like this using javascript...

Code:

myObject.someMethod('something').anotherProperty

much like the

Code:

document.getElementById('someId').style.morestuff

But the thing is, I've been around every DOM whatnot I can find, I just can't seem to make it work.

I kinda need it to make my own DOM for some API i'm writing. So I can write like...

Code:

function someGreatAPI(){
     this.property1='';
     this.property2='';
     //...
     this.method1 = function(var1){            //this should make my firstMethod
           this.nestedProperty = 0;
           this.nestedMethod = someFunction;  //firstMethods nested method

     }
}

//so I can use it like...

var obj = new someGreatAPI();
obj.method1(10).nestedMethod();

It has to be possible, it's possible with document.getelementbyid, right? it has to be.

Thanks in advance.

Iframe Accessing Variables

Similar Tutorials

View Content

Hey

is it possible to access javascript variables in an iframe src page from the parent page, or vice versa. How do you do this? What about the DOM?

thanks

Accessing An Xml File Through Javascript

Similar Tutorials

View Content

i m trying to extract data from an xml file and display data on Google maps
but when i try to run my code

In IE - Access denied error is display (while accessing the xml file)
Mozilla - code is working fine but displays following error -
Error: xmlDoc.getElementsByTagName("lat")[1] is undefined
Source File: file:///I:/BE%20Project%20Data/coding/Myexample/exam2.html
Line: 48

HTML file-

<html>
<head>
<title>Google Maps JavaScript API v3 Example: Fusion Tables Layer</title>
<link href="http://code.google.com/apis/maps/documentation/javascript/examples/default.css" rel="stylesheet" type="text/css" />
<style type="text/css">
html { height: 100% }
body { height: 100%; margin: 0px; padding: 0px }
#map_canvas { height: 500px;width: 800px }
</style>
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
<script type="text/javascript">
function initialize()
{
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.open("GET","agridata.xml",false);
xmlhttp.send();
xmlDoc=xmlhttp.responseXML;
var latlng = new google.maps.LatLng(48.75028,-94.91667);
var mapOpts = {
zoom: 5,
center: latlng,
mapTypeId: google.maps.MapTypeId.ROADMAP,
};
var map = new google.maps.Map(document.getElementById("map_canvas"),mapOpts);

var l1=xmlDoc.getElementsByTagName("lat")[1].childNodes[0].nodeValue;
var l2=xmlDoc.getElementsByTagName("lng")[1].childNodes[0].nodeValue;

var pt = new google.maps.LatLng(parseFloat(l1), parseFloat(l2));
var marker = new google.maps.Marker({
position: pt,
map: map,
title: 'Just a simple marker'});
}
</script>
</head>
<body onload="initialize();">
<h1>output</h1>
<div id="map_canvas"></div>
</body>
</html>

XML file -
<?xml version="1.0"?>

<markers>

<marker>
<lat>52.09667</lat>
<lng>-173.50056</lng>
<state>Alaska</state>
<county>Aleutian</county>
</marker>

<marker>
<lat>48.75028</lat>
<lng>-94.91667</lng>
<state>Minnesota</state>
<county>Lake of woods</county>
</marker>

<marker>
<lat>52.09667</lat>
<lng>-173.50056</lng>
<state>Washington</state>
<county>Stevans</county>
</marker>

</markers>

do let me know the reason behind the undefined error and ACCESS DENIED error ... i have tried modification in the security setting of the browser but error is not solved yet ...

thks

JavaScript - Accessing Css Properties Issue

Accessing Css Properties Issue

Similar Tutorials

Javascript - Accessing Object's Internal Properties

How To Hide The Url From Staus Bar And Properties(right Click Properties)

*please Look At These* Properties And Methods & Changing Properties

Why Offsetxxx Properties Are All Zero ?

Showmodaldialog With Overlay Properties

Objects, Their Properties, And A Little Cleanliness

Getting All Properties Of An Itunes Object?

Array's Native Properties

Need Help Accessing Object

Javascript While Accessing Ul And Li

I Can’t Pass Properties To Function

Remembering Object Properties And Methods

Cloning Object And I Can't Override Properties, Why?

Php And Js (mouseover Conflict) And Table Properties

An If Statement With Check Target Properties

Trouble Working With Custom Properties

Does The In Operator Work On Function Properties?

Nested Methods And Properties In Javascript

Iframe Accessing Variables

Accessing An Xml File Through Javascript

please Look At These Properties And Methods & Changing Properties