Go Back   Serif Software Forums > Design and Publishing > WebPlus

Notices

WebPlus Questions about using WebPlus for website design

 
 
Thread Tools Display Modes
Old 22nd January 2006, 03:27 AM   #1
Mac
Message imported from old Serif Forum
 
Posts: n/a
Lightbulb change javascript font

Nice javascript effect, easy to install in WP9, mimics someone typing out text (see effect): http://www.kicknet.net

Que3stion - text font appears in I beleive 12 point times new roman, and i want 10 point verdana.. I can't find anywhere that states what font - so help please...

script begins:

<span id="typing">
Say what you want to say...
Say what you want to say. Say what you want to say.
Say what you want to say. Say what you want to say.
Among other things, Say what you want to say.
Say what you want to say...
</span>

<script type="text/javascript">

/************************************************** **
* Typing Text script- Dy Trey @ Dynamic Drive Forums
* Visit Dynamic Drive for this script and more: http://www.dynamicdrive.com
* This notice MUST stay intact for legal use
************************************************** **/

interval = 40; // Interval in milliseconds to wait between characters

if(document.getElementById) {
t = document.getElementById("typing");
if(t.innerHTML) {
typingBuffer = ""; // buffer prevents some browsers stripping spaces
it = 0;
mytext = t.innerHTML;
t.innerHTML = "";
typeit();
}
}

function typeit() {
mytext = mytext.replace(/<([^<])*>/, ""); // Strip HTML from text
if(it < mytext.length) {
typingBuffer += mytext.charAt(it);
t.innerHTML = typingBuffer;
it++;
setTimeout("typeit()", interval);
}
}
</script>
 
Old 22nd January 2006, 03:01 PM   #2
'Awful Punster'
Message imported from old Serif Forum
 
Posts: n/a
Lightbulb Re:change javascript font

Dennis,

&nbsp; >>> I can't find anywhere that states what font <<<

That's because it's using the current font, whatever that may be (the browser's default font, in your case). You'll have noticed that the Typing Text Script http://www.dynamicdrive.com/dynamicindex10/text5.htm demo uses the same Verdana as the rest of the page.

As it says at the bottom of the page (although, uncharacteristically, they neglect to tell you how to do it) to change the type/size of the font you need to wrap the style definition around the "typing" span like this:

<div style="font-family:verdana,tahoma,sans-serif; font-size:13px;">
<span id="typing">Pluto is the ninth planet in the solar system. Discovered in 1930 and immediately classified as a planet, its status is currently under dispute. Pluto has an eccentric orbit that is highly inclined in respect to the other planets and takes it inside the orbit of Neptune. Its largest moon is Charon, discovered in 1978; two smaller moons were discovered in 2005.</span></div>

If you define the class "mytype" by putting

&nbsp; <style type="text/css">
&nbsp; <!--
&nbsp; .mytype {
&nbsp; font-family:verdana,tahoma,sans-serif;
&nbsp; font-size:13px;
&nbsp; }
&nbsp; -->
&nbsp; </style>

in the Head Code section of the HTML Code Fragment, you can use <div class="mytype"> instead of <div style="...">. Alternatively, you can use one of the classes WP9 has defined for you (e.g. class="Normal-C3").

Alfred

Click here to visit my Serif-related pages http://serif.awfulpunster.info' onMo..."";return true
 
Old 22nd January 2006, 11:15 PM   #3
Mac
Message imported from old Serif Forum
 
Posts: n/a
Lightbulb Re:change javascript font

Thank you once again Alfred.

I only know html and so I had tried a div with html font code and broke the script.. Your example uses a font class, and 13 px.. OK well I will figure it out. My main concern is someone seeing too large of a font running out of room on top of my colored box there.

Great, the div will work fine.. thanks again.

.......Ok this works too: <div><font face="Verdana" style="font-size: 10pt">

THe problem must have been before when I tried it I put the </div> tag at the bottom of the javascript and not under the </span>
. . . . . . . .

Hey, I don't suppose there is an easy way to add a smidge more space in between each line that wraps under the previous?
 
Old 23rd January 2006, 01:29 AM   #4
'Awful Punster'
Message imported from old Serif Forum
 
Posts: n/a
Lightbulb Re:change javascript font

Dennis,

Normal line-height is 1.2. Try something like this:

&nbsp; <div style="font-family:Verdana, sans-serif; font-size:10pt; line-height:1.5;">

BTW, the 13px font size I used earlier is the 'Use fixed text size' equivalent of 10pt. See Patrick's explanation here http://www.serif.com/forum/ViewThrea...ead=7861#58014.

Alfred
 
Old 23rd January 2006, 08:15 AM   #5
Mac
Message imported from old Serif Forum
 
Posts: n/a
Lightbulb Re:change javascript font

Hey thanks very much.. <DIV ALIGN=JUSTIFY at the beginning even works right with this typing effect script..
 
 

Bookmarks

Thread Tools
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off

Forum Jump


All times are GMT +1. The time now is 11:20 AM.