How to combine Two Javascript in html? Options

[maria26]

I have a two javascript command on my html file. The first script is about to control the size of the text, it is link to textsizer.js
The 2nd script is about a Floating Homepage button and link to floating_buttons.js its function is to always float a button and that button is link to my Homepage.
I want to add the The Textsizer controls beside the Floating Homepage Button, because the font controls Smaller Text and Bigger Text were just a place permanently on the upper part of the page, I wan them to be floating style also like the HomePage Button, sothat when the user scroll the page, he can increase the Fonts anytime because the Text Sizer is floating too like the homepage button.

[pandy]

He can do that anytime he wants anyway because that's built into every visual browser known to man.

You should be able to do what you want though, but how depends on how the HTML an JS looks. Can you link to a page that uses both javascripts?

OR, you could just use CSS position: fixed. You would get rid of the jumping the JavaScript always causes at the same time...

[maria26]

He can do that anytime he wants anyway because that's built into every visual browser known to man.

You should be able to do what you want though, but how depends on how the HTML an JS looks. Can you link to a page that uses both javascripts?

OR, you could just use CSS position: fixed. You would get rid of the jumping the JavaScript always causes at the same time...

I do the page offline, heres the screenshots

[CharlesEF]

The pictures do me no good. I have to see the code if you want any help. Do you have a website that you could post a temp page to? If not then you need to post the actual HTML code for 1chronicles.html, as a starting place. Or zip it up and attach it to your next post.

Charles

This post has been edited by CharlesEF: Jul 31 2013, 03:27 AM

[maria26]

The pictures do me no good. I have to see the code if you want any help. Do you have a website that you could post a temp page to? If not then you need to post the actual HTML code for 1chronicles.html, as a starting place. Or zip it up and attach it to your next post.

Charles

Here is the attached file with the 2 javascript.  2chronicles_help.rar ( 60.72k ) Number of downloads: 291

[pandy]

The home button is written out by the JavaScript. You could let it write the HTML for the resizer too, but it gets a little messy.

If I may suggest that you ditch staticlogo.js altogether. Instead you take the HTML it writes out and put it in a DIV and give that DIV an id, like so:

HTML

<div id="fixed">
<a href="index.htm" title="HomePage"><img src="home.png" style="border:0" /></a></div>

You can place that wherever you like, but just before the closing BODY tag or just after the start tag for BODY would be a good place.

Now you add this to your style sheet.

CODE

#fixed  { position: fixed;
          bottom: 10px; right: 10px }

See how that looks. Just as before, but much simpler, right?

Everything you put inside that DIV with the id 'fixed' will also stay fixed down there. So you take the HTML for the resizer and move it there. It will take some more to look nice, but that's the principle.

[CharlesEF]

As pandy had said, the floating home page control is placed in the body of the HTML by javascript. If you want to make your textsizer control float along with the home page then you will need to do more than just combine the 2 js file together.

I think this will take some time (at least for me, anyway) and is beyond the scope of simple help. If I get some free time next week I might be able to help but you might be better off paying someone to make these changes for you. Or try pandys suggestion and see what happens.

[maria26]

Thanks both of you Pandy and CharlesEF!

As Pandy suggested, I removed the staticlogo.js completely and used the DIV Tag with fixed position!

I used below only and it achieves my desired function and looks;

CODE

<div style=position:fixed;bottom:10px;right:10px;align="right" width="25%"><font size="-2"><a href="index.htm" title="HomePage"><img src="home.png" style="border:0" align=middle></a>  |  <a href="java script:ts('body',1)"><font size=4>+ Larger Font</a>  |  <a href="java script:ts('body',-1)">- Smaller Font</a></font></font></div>

I attached the final html files too
 2chronicles_help.rar ( 59.07k ) Number of downloads: 279