scottybwoy

November 26, 2007

Thanks Wildteen,

However I did not find anything of use from that site u gave me. If you take a look at my code and the page I linked to, you will see that most of the nav bar is using css. However at either side of the link there are some images to be swapped, or possibly just layered over each other, just not sure how to go about that bit. If you have another quick look I'd be greatfull.

November 22, 2007

Any one know what way I can go about replacing some javaScript func's that change some images during rollover. You can see what I'm trying to achieve in this link here :

http://www.mri.co.uk/company-info/terms-of-business2.htm

At the moment, I'm using some very messy business like so : (is just a snippet for explanatory purposes)

<li>
<a class="drop r" href="http://www.mri.co.uk/news/index.htm" onmouseout="MM_swapImage('mri_head_r2_c2','','http://www.mri.co.uk/header/mri_head_c.png',1); MM_swapImage('tab1','','http://www.mri.co.uk/header/grey.gif',1);" onmouseover="MM_swapImage('mri_head_r2_c2','','http://www.mri.co.uk/header/mri_head_r_up.png',1); MM_swapImage('tab1','','http://www.mri.co.uk/header/ru.gif',1);" title='News'>News</a>
<img name="tab1" src='http://www.mri.co.uk/header/grey.gif' alt="" />
</li>
<li>
<a class="drop y" href="http://www.mri.co.uk/products/index.htm" onmouseout="MM_swapImage('tab1','','http://www.mri.co.uk/header/grey.gif',1); MM_swapImage('tab2','','http://www.mri.co.uk/header/grey.gif',1);" onmouseover="MM_swapImage('tab1','','http://www.mri.co.uk/header/yd.gif',1); MM_swapImage('tab2','','http://www.mri.co.uk/header/yu.gif',1);" title='Products'>Products<!--[if IE 7]><!--></a><!--<![endif]-->
<!--[if lte IE 6]><table><tr><td><![endif]-->
<ul id='yellow' onmouseout="MM_swapImage('tab1','','http://www.mri.co.uk/header/grey.gif',1); MM_swapImage('tab2','','http://www.mri.co.uk/header/grey.gif',1);" onmouseover="MM_swapImage('tab1','','http://www.mri.co.uk/header/yd.gif',1); MM_swapImage('tab2','','http://www.mri.co.uk/header/yu.gif',1);">
<li>

Is there some way of arranging my list links to encompass the images and maybe put them one over the other or something like that, do you know what I mean?

Or any other ideas would be greatful, thanks.

November 22, 2007

I solved this for anyone who also ran into this problem.

I changed this :

option.text = items[ii].getAttribute('name'); // Works in Firefox

// To this :

option.appendChild(document.createTextNode(items[ii].getAttribute('name')));
// Which works in firefox and Ie

November 22, 2007

I've cracked it!!

If anyone wants the code, here it is:

var x = document.getElementById('java');
var y = x.appendChild(document.createElement('a'));

y.href = arr.link;
y.className = arr.style;
y.title = arr.title;
y.innerHTML = arr.linkText;

if(arr.subs1) {
	var sub = arr.subs1;

	var z = x.appendChild(document.createElement('div'));
	z.id = arr.linkText;
	z.className = 'in';

	for (var i=0; i<sub.length; i++) {
		var a = z.appendChild(document.createElement('a'));
		a.href = sub[i].link;
		a.className = sub[i].style;
		a.title = sub[i].title;
		a.appendChild(document.createTextNode(sub[i].linkText));

		if(sub[i].subs2) {
			var sub2 = sub[i].subs2;

			var b = z.appendChild(document.createElement('div'));
			b.id = sub[i].linkText;
			b.className = 'in';

			for (var ii=0; ii<sub2.length; ii++) {
				var c = b.appendChild(document.createElement('a'));
				c.href = sub2[ii].link;
				c.className = sub2[ii].style;
				c.title = sub2[ii].title;
				c.appendChild(document.createTextNode(sub2[ii].linkText));
			}
		}
	}
}

Just feed it two tier arrays and using the sub.element names as keys. I put mine in a json file.

November 22, 2007

Thanks for that obsidian, I should have worked that out myself before trying here. Although I am now stuck a bit further on, one problem is to do with how my elements are being nested into each other and why my for loop crashes when there is no data in the object being handled.

From this link : http://www.mri.co.uk/company-info/terms-of-business2.htm you can see the left hand nav bar is what I am working on.

1) it does not show the link text, but does link (in FF).

2) spews out an error as the second loop has no values.

Here's the javascript:

var x = document.getElementById('java');
var y = x.appendChild(document.createElement('a'));

y.href = arr.link;
y.className = arr.style;
y.title = arr.title;
y.innerHTML = arr.linkText;

var z = x.appendChild(document.createElement('div'));
z.id = arr.linkText;
z.className = 'in';

var sub = arr.subs1;

for (var i=0; i<sub.length; i++) {
var a = z.appendChild(document.createElement('a'));
a.href = sub[i].link;
a.className = sub[i].style;
a.title = sub[i].title;
a.innerHtml = sub[i].linkText;
alert(a.innerHtml);

var sub2 = sub[i].subs2;

for (var ii=0; ii<sub2.length; ii++) {

	if (ii == 0) {
		var b = z.appendChild(document.createElement('div'));
		b.id = sub[i].linkText;
		b.className = 'in';
	}

	var c = b.appendChild(document.createElement('a'));
	c.href = sub2[ii].link;
	c.className = sub2[ii].style;
	c.title = sub2[ii].title;
	c.innerHtml = sub2[ii].linkText;
}
}

I tried putting an if clause above the second loop like if(sub2.length <1) But that didn't help.

An I'm not sure if I'm nesting my elements properly. Any help greatly appreciated.

November 21, 2007

Hi all,

I'm trying to create some elements, but they don't seem to be comming out, I was wondering if it could be that fact that I'm assigning classes and class is a reserved word in javascript. here's some code to show u:

var links = JSONData.topLinks;

for (var i=0; i<links.length; i++) {
var firstHref = document.createElement("a");
firstHref.href = links[i].link;
firstHref.class = links[i].class;
firstHref.title = links[i].title;
firstHref.innerHtml = links[i].text;
document.getElementById("java").appendChild(firstHref);

var div1 = document.createElement("div");
div1.id = links[i].text;
div1.class = "in";
document.getElementById("java").appendChild(div1);
}

So basically here, I have a link, followed by a div for each entry in my json file. But I get nothing, also is there a way of seeing the java output as it doesn't appear in the source. (I select menu that does work)

November 21, 2007

It can be done just using css, which is more browser compatible. check these menus out:

http://www.cssplay.co.uk/menus/

November 21, 2007

If you could post a small sample of what code u are using, someone may be able to point you in the right direction.

Please note that both Java and PhP do not get "styled" it is only the html code, that may be embedded in your other code.

Are you using an external .css file? I know that dreamwever does what you want, doesn't frontpage? I've not used frontpage so not sure.

November 21, 2007

U can use css to wordwrap in the div.

create a class like this :

div {

display: block;

width: 20%

height: 20%;

overflow: hidden;

white-space: normal;

}

Anything that won't fit will be chopped off. But u can get it to use a scrollbar if u want. I think thats where wordwrap comes in, although maybe overflow. check wc3 schools.

Good luck

November 21, 2007

Thanks, it was not a problem with the code. I just used that one as an example. What I wanted to know is why that error comes up sometimes. I have seen it with a few functions, but also new to Java, (more a php person) just wanted to know why.

November 20, 2007

Hi RSprinkel,

For what you want to do, I don't think you need to use any JavaScript. It can just be done with css and html.

There are some examples here : http://www.cssplay.co.uk/menus/

With just a bit of tweaking you can replace the text links with images and play around with the styling to get it to go with your site and or images.

Good Luck, hope thats what your after.

November 20, 2007

Why would text.replace give an error that it is not a function and halt the script?

Here is how it is evoked:

if (/^[\],:{}\s]*$/.test(text.replace(/\\./g, '@').
replace(/"[^"\\\n\r]*""|true|false|null|-?\d+(?:\.\d*)?(:?[eE][+\-]?\d+)?/g, ']').
replace(/(?:^|:|,)(?:\s*\[)+/g, ''))) {

}

Thanks

November 15, 2007

OK, I have this pretty much working, however there is a subtle problem with Internet Explorer, that I think is down to something to do with the javaScript syntax. I'll post all the code I have again so it can be followed.

What the problem is that the option for the select menu do are there and the link works but there is no text displaying the product code. Thanks for looking.

HTML

<body onload="postselect();">
<select id='menu' class='in' onchange='go()' name='menu'>
<option>Jump to Product</option>
</select>

XML

<?xml version="1.0" encoding="ISO-8859-1"?>
<select>
   <category type='Controllers'>
      <model name='MRI-2500U2/R' value='http://www.mri.co.uk/products/Controllers/2500U2_R.htm' />
      <model name='MRI-2500UW/R' value='http://www.mri.co.uk/products/Controllers/2500UW_R.htm' />
   </category>
   <category type='Input Output'>
      <model name='MRI-4S/ETHERNET/R' value='http://www.mri.co.uk/products/InputOutput/ether4s.htm' />
      <model name='MRI-4S/USB/IS/R' value='http://www.mri.co.uk/products/InputOutput/usb4sIs.htm' />
   </category>
</select>

JS

function postselect() {
xmlDoc=loadXMLDoc("http://www.mri.co.uk/xml/select_menu.xml");

var categories = xmlDoc.getElementsByTagName('category');
var numCats = categories.length;

for (var i=0; i<numCats; i++) {
	var optgrp = optNew = document.createElement("optgroup");
	optgrp.label = categories[i].getAttribute('type');
	document.getElementById("menu").appendChild(optgrp);

	var items = categories[i].getElementsByTagName('model');
	var numItems = items.length;

	for (var ii=0; ii<numItems; ii++) {
		var option = optNew = document.createElement("option");
		option.text = items[ii].getAttribute('name');
		option.value = items[ii].getAttribute('value');
		document.getElementById("menu").appendChild(option);
	}
}
}

November 13, 2007

Bump

November 8, 2007

Hi,

I've been playing around with JS and XML for about a couple of days now and would like to know if this is possible.

I want to use Javascript to pull out all the options for my select menu, but can't get it working, here's what I have so far :

html

<body onload="loadXML();">
<select id='menu' class='in' onchange='go()' name='prodSelect' onload="">
		<option value=''>Select a product</option>
		<optgroup id='category' label=''>
			<option id='subcat' value=''></option>
		</optgroup>
	</select>
</body>

xml

<category title="Controllers">
<product>
	<modelid>MRI-2500U2/R</model_id>
	<link>http://www.mri.co.uk/products/Controllers/2500U2_R.htm</link>
</product>
<product>
	<modelid>MRI-2500UW/R</model_id>
	<link>http://www.mri.co.uk/products/Controllers/2500UW_R.htm</link>
</product>
</category>
<category title="InputOutput">
<product>
	<modelid>MRI-4S/ETHERNET/R</model_id>
	<link>http://www.mri.co.uk/products/InputOutput/ether4s.htm</link>
</product>
<product>
	<modelid>MRI-4S/USB/IS/R</model_id>
	<link>http://www.mri.co.uk/products/InputOutput/usb4sIs.htm</link>
</product>
</category>

js

var xmlDoc;
function loadXML() {
if (window.ActiveXObject) {
	// code for IE
	xmlDoc=new ActiveXObject("Microsoft.XMLDOM");
	xmlDoc.async=false;
	xmlDoc.load("http://www.mri.co.uk/xml/select_menu.xml");
	getmessage();
}	else if (document.implementation &&	document.implementation.createDocument) {
	// code for Mozilla, Firefox, Opera, etc.
	xmlDoc=document.implementation.createDocument("","",null);
	xmlDoc.load("http://www.mri.co.uk/xml/select_menu.xml");
	xmlDoc.onload=getmessage;
}	else {
	alert('Your browser cannot handle this script');
}
}

function getmessage() {
//the x variable will hold a NodeList
var x=xmlDoc.getElementsByTagName('category');

for (i=0;i<x.length;i++) {
	document.getElementById("category").label=x[i].getAttribute('title')[0];

	// Yeah I know these lines are wrong, just not at that stage yet
	document.getElementById("subcat").value=xmlDoc.getElementsByTagName("link")[0].childNodes[0].nodeValue;
	document.getElementById("subcat").innerHTML=xmlDoc.getElementsByTagName("modelid")[0].childNodes[0].nodeValue;
  }

}

As you can see, what I want is to take the category title from the xml and put that in the optgroup label attribute.

Then put all the links into the option value and the modelId into the innerHtml of the option.

So I can just update the one file and it will work accross the whole site.

Thanks, If you could point me into getting the syntax sorted for the HTML Dom I'd be greatful.

November 8, 2007

Solved by applying display : block style to the image in the first cell.

November 7, 2007

Well I did mention I'd like to have it tableless. And that is the only table on the page, sorry if it's a bit of a mess.

All I want is a horizontal line at absolute position top:51 left:360 height:2 color:#c00 length: 100% -360. Anyone know the easiest way to do that I'd be greatful.

It would also work if the image just goes over the top and the lines length is 100%, but want it to work in all browsers.

Thanks for you time

November 6, 2007

This has been annoying me for a few days now and I can't quite get the right combination of thigs to get it right can someone have a peek for me please.

Here's the URL : http://www.mri.co.uk/company-info/terms-of-business2.htm

It displays fine in firefox, but not IE.

This shud be able to work without a spacer .gif shudn't it. I think it all came about when I changed the doctype tag, but this is the doctype tag I want to use, so need to get this working.

As you can see it drops down a couple of pixels and ruins the level of the nav and the rest of the page. If I take out the first image (the one that says MRi) it works fine. I played around with padding etc, but nothing, as soon as the image goes in it displaces it.

If someone could show me how to do it with div's id b greatfull, although am using a fixed width image and 100% page width site.

Chrees, scotty b

October 23, 2007

Got it! I used :

SELECT TOP 1 modelId, purchasing, image FROM products AS r1

JOIN (SELECT ROUND(

RAND() * (

SELECT MAX(products.rrp) FROM products

), 1

) AS id

) AS r2 ON r1.rrp >= r2.id AND endOfLine != 'TRUE'

ORDER BY r1.rrp ASC

Problem was using a varchar as a handle wen it needed a float.

May I also ask where you source info like this? Thanks for your help

October 23, 2007

Yes your right, however

SELECT TOP 1 modelId, purchasing, image FROM products AS r1

JOIN (SELECT ROUND(RAND() * (SELECT MAX(id) FROM products), 1) AS id) AS r2

WHERE r1.id >= r2.id

ORDER BY r1.id ASC

Returns an error of incorrect syntax near the keyword 'WHERE'.

Can you see what the error is, excuse my lack of knowledge on the complexity of this use of SQL, still a newb.

Thanks

By the way I added a 1 to Round()

October 23, 2007

Wow, glad there's something that simple, however LIMIT is not supported in MS SQL any alternatives? Thanks

October 23, 2007

Just a quicky,

Is there a way to either select a random row from a column in an MS SQL table or from an array? If so how would I go about it?

Thanks

October 10, 2007

Bump

October 9, 2007

I have a strange thing happening here: I have a simple link that passes a handle over the header like so:

<a href='index.php?content=diary'>Diary</a>

<a href='index.php?content=committee'>Committee</a>

It is in a html template, that my php script grabs and spews out, well thats not that important as it does it for every case of this example.

If I view the source it is generating this :

<a href='index.php?content=diary&PHPSESSID=186143ed2350950bc689aa45b209c4bc'>Diary</a>

<a href='index.php?content=committee&PHPSESSID=186143ed2350950bc689aa45b209c4bc'>Committee</a>

Why would that be? Is it a setting in the ini file? I would like to get around this as I obtained a copy of the ini file used by my host freehostia. Thanks in advance.

September 17, 2007

LOL!!!!

How silly I have been, I didn't even have a name for the input field! Thanks for all your time over my schoolboy error! lol

Sign In

scottybwoy

Posts

Joined

Last visited

Content Type

Profiles

Forums

Posts posted by scottybwoy

[SOLVED] smoother and more compatible rollover

[SOLVED] smoother and more compatible rollover

[SOLVED] JavaScript XML Dropdown List

[SOLVED] create element class

[SOLVED] create element class

[SOLVED] create element class

[SOLVED] I think this is JS, but not sure - if so, how is this done???

Help with PHP file w/Javascript dependent styling

[SOLVED] Stop huge words

text.replace()

Seeking Menu Information

text.replace()

[SOLVED] JavaScript XML Dropdown List

[SOLVED] JavaScript XML Dropdown List

[SOLVED] JavaScript XML Dropdown List

[SOLVED] header display inconsistency problems

[SOLVED] header display inconsistency problems

[SOLVED] header display inconsistency problems

[SOLVED] Random Select

[SOLVED] Random Select

[SOLVED] Random Select

[SOLVED] Random Select

sending sess data in links!

sending sess data in links!

[SOLVED] md5 and post

Browse

Activity

Important Information