Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

Register Log in
  • Congratulations SkipVought on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

using FontJazz in dropdown list menu

Status
Not open for further replies.
fullmoon2

fullmoon2

Technical User
Aug 14, 2005
20
0
0
I'm trying to replace an ordinary font in my dropdownlist menu, with another none standard font with FontJazz.
But I have some problems to make it work..
The dropdownlist menu is in a Template in Dreamweaver.

I've tried the example:


in an ordinary index.html in <h1></h1>.

It works perfect, but when I try to use it in my template in:

<ul>
<li><a href="#"><h4>Contact</h4></a></li>
</ul>

and change h1 in the example to h4
<script type="text/javascript">
FontJazz.apply("h4", "font");
</script>

it doesn't help at all. I put the <script type="...FontJazz.apply..</script> inside the <ul></ul>.

The <script> tags in <head> are pointing to where I placed the "fontjazz.js" (src="../js/fontjazz.js" in the folder "js") and my generated "font.js"(src="../js/fonts.js") file.


Please ask if you need further explanation.
THANKS FOR ANY HELP!:)
...or if you think another font-generator would be better.
 
Sort by date Sort by votes
Looking at the Help section in FontJazz's page, it would seem, you need to place the <script> at the bottom of your page, just before the </body> tag.

I assume its because the selected tags must be fully rendered for the JS to be able to find them and modify them. So the JS must be run after the page and all the tags that need changing have loaded.

Alternatively I guess sticking it in the Onload event of the <body> tag may work as well.

Code: 
<body onLoad="FontJazz.apply("h4", "font");">
...

----------------------------------
Phil AKA Vacunita
----------------------------------
Ignorance is not necessarily Bliss, case in point:
Unknown has caused an Unknown Error on Unknown and must be shutdown to prevent damage to Unknown.
 
Upvote 0 Downvote
Hm... no response on that..

I tried to write
<script type="text/javascript">
FontJazz.apply("li", "font");
</script>

and it kind of work.. but instead of the right word("contact"), it says "null".. maybe a errormessage or someting.. But the font works..
and the "float:left;" doesn't work, so all the <li></li> goes below like this:
null
null
null

Thanks again for helping me! :)
 
Upvote 0 Downvote
Where did you place the fontjazz.apply call? Did you try the onload version? It works for me.

I messed up there, it should look like this:

Code: 
<body onLoad=[red]'[/red]FontJazz.apply("h4", "font");[red]'[/red]>

Notice the single quote instead of the double quote.

As far as the floating and other stylings go, the FontJazz script changes the selected tags to a very complex barrage of divs and spans so your rules are no longer applied, so you would need to apply the float and other specific CSS stylings directly to it. Add this rule to your CSS for the float:

Code: 
.FontJazz-font{
float:left !important;
}




----------------------------------
Phil AKA Vacunita
----------------------------------
Ignorance is not necessarily Bliss, case in point:
Unknown has caused an Unknown Error on Unknown and must be shutdown to prevent damage to Unknown.
 
Upvote 0 Downvote
Status
Not open for further replies.

Similar threads

trevil620
  • Locked
  • Question
SoThink DHTML Menu Conversion
Replies
0
Views
111
trevil620
trevil620
TheLazyPig
  • Locked
  • Question
Dropdown (option) using Anguarjs
Replies
0
Views
119
TheLazyPig
TheLazyPig
jomat
  • Locked
  • Question
JS to show the timer in html under title instead of in the status bar
Replies
2
Views
167
xwb
xwb
198709km
  • Locked
  • Question
Grouping XML key value using XSLT
Replies
0
Views
108
198709km
198709km
berkshirea
  • Locked
  • Question
Dropdown, Select, Required 1
Replies
8
Views
77
berkshirea
berkshirea

Part and Inventory Search

Sponsor

Back
Top