/    Sign up×
Community /Pin to ProfileBookmark

navbar generator script

I’m a novice and I’ve been working on this for weeks. It’s a generator for navbars with table cell bgcolor change onmouseover. So far it only produces the word “Link” in each table cell, requiring the user to insert the actual link name and URL manually. I want the user to be able to enter the linkname and URL on the form and have this data inserted into the proper <td> line of generated code. I know this requires function addlink(), but I can’t figure out how to write one that works. Here’s my script so far:

// Start Generator Function
function process() {

// Set Variables
var rows = document.form.rows.value * 1
var cols = document.form.cols.value *
1
var width = document.form.width.value * 1
var border = document.form.border.value *
1
var bordercolor = document.form.bordercolor.value
var cellpadding = document.form.cellpadding.value * 1
var align = document.form.align.value
var tdalign = document.form.tdalign.value
var onMouseOver = document.form.onMouseOver.value
var onMouseOut = document.form.onMouseOut.value
var url = document.form.url.value
var textcolor = document.form.textcolor.value
var bgcolor = document.form.bgcolor.value

// Table tag creation
var table = “<table width=”” + width + “”n”
table += ” border=”” + border + “”n”
table += ” bordercolor=”” + bordercolor + “”n”
table += ” cellpadding=”” + cellpadding + “”n”
table += ” cellspacing=”0″ + “”n”
table += ” align=”” + align + “”n”
table += ” bgColor=”” + bgcolor + “”n”

// Calculate the width for <TD>
var tdwidth = width / cols

// Start Main Loop
for (i = 1; i <= rows; i++) {
table += “<tr>n”

// TD Loop
for (t = 1; t <= cols; t++) {
table += “<td width=”” + tdwidth + “” align=”” + tdalign + “” onMouseOver=”” + onMouseOver + “” onMouseOut=”” + onMouseOut + “”><a href=”” + url + “”>n”
table += “<font color=”” + textcolor + “”>n”
table += ” Link ” + i +” n”
table += “</td>n”
}

table += “</tr>nn”
}

to post a comment
JavaScript

5 Comments(s)

Copy linkTweet thisAlerts:
@JonaMar 25.2003 — document.form is not acceptible. Change the name of your form to something else. Or use document.forms[0] if you only have one form on the page.
Copy linkTweet thisAlerts:
@starrwriterauthorMar 26.2003 — [i]Originally posted by Jona [/i]

[B]document.form is not acceptible. Change the name of your form to something else. Or use document.forms[0] if you only have one form on the page. [/B][/QUOTE]


document.form works fine with the existing navbar generator. I was asking how to write a function addlink() to improve the generator.
Copy linkTweet thisAlerts:
@JonaMar 26.2003 — Here you go. I got it all figured out. ?

<html><head>

<script>

function process() {

var rows = parseInt(document.form.rows.value)

var cols = parseInt(document.form.cols.value)

var width = parseInt(document.form.width.value)

var border = parseInt(document.form.border.value)

var bordercolor = document.form.bordercolor.value

var cellpadding = parseInt(document.form.cellpadding.value)

var align = document.form.align.value

var tdalign = document.form.tdalign.value

var MouseOver = document.form.MouseOver.value

var MouseOut = document.form.MouseOut.value

var url = document.form.url.value

var textcolor = document.form.textcolor.value

var bgcolor = document.form.bgcolor.value

var table = "<table width='"+width+"'n"

table += " border='"+border+"'n"

table += " bordercolor='"+bordercolor+"'n"

table += " cellpadding='"+cellpadding+"'n"

table += " cellspacing=0n"

table += " align='"+align+"'n"

table += " bgColor='"+bgcolor+"'>n"

var tdwidth = width * cols

for (i = 1; i <= rows; i++) {

table += "<tr>n"

for (t = 1; t <= cols; t++) {

table += "<td width='"+tdwidth+"' align='"+tdalign+"' onMouseOver="this.style.backgroundColor='"+MouseOver+"'" onMouseOut="this.style.backgroundColor='"+MouseOut+"'"><a href='"+url+"'>n"

table += "<font color='"+textcolor+"'>n"

table += "Link"+i+"n"

table += "</font></a></td>n"

}

table += "</tr>nn"

}

table += "</table>"

divy.innerHTML=table

}

</script></head>

<body>

<form name="form">

<input type=text name=rows value="rows">

<input type=text name=cols value="cols">

<input type=text name=width value="width">

<input type=text name=border value="border">

<input type=text name=bordercolor value="bordercolor">

<input type=text name=cellpadding value="cellpadding">

<input type=text name=align value="align">

<input type=text name=tdalign value="tdalign">

<input type=text name=MouseOver value="MouseOver">

<input type=text name=MouseOut value="MouseOut">

<input type=text name=url value="url">

<input type=text name=textcolor value="textcolor">

<input type=text name=bgcolor value="bgcolor">

<input type=button onClick="process();alert(divy.innerHTML)" value="Process"><br><br>

<div id="divy"></div>
Copy linkTweet thisAlerts:
@starrwriterauthorMar 26.2003 — [i]Originally posted by Jona [/i]

[B]Here you go. I got it all figured out. ?



Jona,

Thanks for trying. Your script is simpler and more elegant than mine, but it produces exactly the same result:

Link 1

Link 2

Link 3 (all with the same URL)



I want the form user to input separate link names and link URLs for each table cell. As I see it, I have to write some sort of function addlink () to replace these lines of the script:

table +=<a href='"+url+"'>n"

table += "Link"+i+"n"

But I don't know how to do it.
Copy linkTweet thisAlerts:
@JonaMar 26.2003 — You do not necessarily have to create another function to do this. The thing is, you're going to have to have a lot of text fields for them to put the URLs and names of the links in... You can try using the eval() method.
×

Success!

Help @starrwriter spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 BETA 5.28,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,

tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,
)...