You could put js code directly in a html-object, or you could put it in the expert tab on the html

Or make it as reference in the htmnl-code and put it where you like.

I think it is dependent of the purpose.

I have for example some wow-slider files, wher ethere is som js-files and some data files ( images). Her I specify in the htnml-code where I have placed the files.

Kind regards

John S.

Thank you, John!

1. I used to have all Java stuff outside the software, with references in 1 Settings - Statistics, SEO and Code - Expert - Files linked to HTML code. I will remove these references now.

2. Do you mean I can put the function definitions (I have two of them) directly in  4 Pages - HTML code object?

3. Is there a specific template with these examples?

Hello Thomas

In the html-object you have some html and some javascript.

Could be like this :

<button onclick="function2()">expand all</button> // just a button

Some styling :

<style>
#example_tree{
text-align: left;
font-size: 20px;
line-height: 30px;

}
tab0 { position:absolute;left:25px; }
tab1 { position:absolute;left:50px; }
tab2 { position:absolute;left:75px; }
tab3 { position:relative;left:100px; }
tab4 { position:absolute;left:125px; }
tab5 { position:absolute;left:150px; }
tab6 { position:absolute;left:175px; }
tab7 { position:absolute;left:200px; }
tab8 { position:absolute;left:225px; }
tab9 { position:absolute;left:250px; }
tab10 { position:absolute;left:275px; }
</style>

The styling could / should maybe be in the expert tab.

Then some html

<UL id="example_tree">
<LI><a href="http://pknudsen.net/gps/gpxviewer.php?gpstur=583" ><img src="http://www.bramminginfo.dk/brm09/images/SMhome.jpg" width='40' onmouseover='this.width=300' onmouseout='this.width=40' alt='noimage'"></a><span>►Home</span></LI>
<LI><a href="http://pknudsen.net/gps/gpxviewer.php?gpstur=583" ><img src="http://www.bramminginfo.dk/brm09/images/SMfunctions.jpg" width='40' onmouseover='this.width=300' onmouseout='this.width=40' alt='noimage'"></a><span>►Functions</span></LI>

......

...

and then some java

<script type="text/javascript">
var allSpan = document.getElementsByTagName('SPAN');
for(var i = 0; i < allSpan.length; i++){
allSpan[i].onclick=function(){
if(this.parentNode){
var childList = this.parentNode.getElementsByTagName('UL');
for(var j = 0; j< childList.length;j++){
var currentState = childList[j].style.display;
if(currentState=="none"){
childList[j].style.display="block";
}else{
childList[j].style.display="none";
}
}
}
}
}
</script>

This is for an advanced sitemap ( unfortunately manuel ) I am testing at the moment.

http://www.bramminginfo.dk/brm09/expand03.html

The formatting has gone, and there is much unneeded but I hope you see what I mean.

A more advanced version ( but yet without images ) can be seen here :

http://www.bramminginfo.dk/brm09/expand06.html

The last example is not with java but jQuery but the princip is the same.

Hope it is helpful for you.

Kind regards

John S.

I hope it was something like this you meant. If it is one or more functions, then it is something like this you can make.

I have here : http://www.calendarforum.dk/restaurant/about-the-staff.html

some show-more/less functions.

There is 6 html-objects that has text. Only in one of the objects, the needed functions are put in - the rest of the objects uses the same functions, but only has the text to show.

Thank you, John, for the information. I tried to put my JS and HTML code the way you suggested - it didn't work for me...

If you could, please, try to answer my problems...

The HTML code is as below:

My JS file (jReadText.js) is located outside the software in Preview/files folder:

If I remove this link to the file, where do I put the code? The code is:

function fGetText() {
    $.get('MyFiles/TextTest.txt', function(textData) {
    aLines = textData.split("\n");
        $.each(aLines, function(n, sLine) {
            if (sLine.length <= 2) {
                $('#From_Text_File').append('<br>');
            } else {
                $('#From_Text_File').append('<div>' + sLine + '</div>');
            }
        });
    }, 'text');
}

The text file to be read is Preview/MyFiles/TextTest.txt. The text from this file is being displayed on the page.

The HTML code in HTML-object:

This configuration works fine.

I just cannot figure out wht to do if I remove link to jReadText.js. Where toput the JS code and in what form.

I don't have CSS styling yet.

Hello Thomas

I will make some test tomorrow.

Kind regards

John S.

You're the best, John!

Attached is the js file with the function. Works great when outside WSX5.

Hello Thomas

I have made a very simple test here : http://www.bramminginfo.dk/brm09/side-40.html

When you click on one of the buttons a text is inserted on the page.

It is a quick-and-dirty, where I have just copied the function twice. Just to show the princip.

Here it comes :

In 1:

<button onclick="fGetText()">gettext</button>

In 2:

<button onclick="fGetText2()">gettext2</button>

In 3:

<button onclick="fGetText3()">gettext3</button>

In 4:

<script type="text/javascript">
function fGetText() {
$.get('./testfiles/TextTest.txt', function(textData) {
aLines = textData.split("\n");
$.each(aLines, function(n, sLine) {
if (sLine.length <= 2) {
$('#From_Text_File').append('<br>');
} else {
$('#From_Text_File').append('<div>' + sLine + '</div>');
}
});
}, 'text');
}

function fGetText2() {
$.get('./testfiles/TextTest1.txt', function(textData) {
aLines = textData.split("\n");
$.each(aLines, function(n, sLine) {
if (sLine.length <= 2) {
$('#From_Text_File').append('<br>');
} else {
$('#From_Text_File').append('<div>' + sLine + '</div>');
}
});
}, 'text');
}

function fGetText3() {
$.get('./testfiles/TextTest2.txt', function(textData) {
aLines = textData.split("\n");
$.each(aLines, function(n, sLine) {
if (sLine.length <= 2) {
$('#From_Text_File').append('<br>');
} else {
$('#From_Text_File').append('<div>' + sLine + '</div>');
}
});
}, 'text');
}

</script>

In 5:

<div align="left">
<div id=From_Text_File></div>
</div>

That is all. No CSS - all is inserted in the HTML-code tab.

No code in the CEO/statistics - No code in the page properties.

Just simple code in the html-object.

It could all have been in one HTML-object, but the buttons was easier to have beside each other this way.

It is also to show that the code can be "spread" over a page.

Hope you are helped by this,

Kind regards

John S.

Hello again Thomas

I would like to know, if you can have it to function. I would also like to know what this is intended to be used for.

If you want the function to run when the page is loaded, you could use the onload function.

I saw in one of your other posts that you are experimenting with Google Maps - do you have some example/material about this ?

Kind regards

John

Hi John,

Of course, your code worked for me, but this was just part of what I would like to accomplish.

On the page I have implemented FAQs, I use two Java scripts, stored “outside” WSX5. One is reading the file with questions and answers and displays is on the page, the second one is adding functionality to them.

All works fine when ran from WSX5, but doesn’t work from the hosting server. The second script (which is jQuery) works only sometimes, most of the times it doesn't. Very inconsistent. The hosting support couldn’t figure out why it happens. So I decided to include code of both functions within the software.

I am attaching the project with both scripts. (rename to .iwzip)

When it comes to the Google map – I also got it working. I’ll make a simple page and attach the project (here) later today or tomorrow.

(This page should have PM - Private Messages implemented to exchange information you don't necessarily want everybody to see...)

Here is the project with the Google map generated in HTML code. The address is taken from the last two lines of the text file.

(rename to .iwzip)

Hello Thomas

If you have some private "stuff", then you can contact me here : http://calendarforum.dk/contact.html

Have you considered using a kind of accordion for the FAQ.

I have one here : http://www.bramminginfo.dk/brm09/expand06.html

And another example here : http://www.energifremtiden.dk/c4d/accordion-3---copy.html

In the last example, only focus on the accordion.

I haven't looked in the files yet, so maybe I better understand tomorrow.

Kind regards

John

I contacted you as you suggested, John.

For those interested: I found out where (within WSX5) to put additional code of HTML, CSS and JavaScript.

Here is the picture that should be self explanatory: