The text in this showcase seems to get bolder after the page loads

Hi there,
If you look at this site here:
http://amandawatson.com.au/ronin/lead-generation.html

You will notice the showcase module (main image in the showcase position), Is using some special font, that when the pages loads comes up fatter somehow!

Can someone help me fix this please.
LVL 11
Amanda WatsonWeb DeveloperAsked:
Who is Participating?
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

NetExpert-WarszawaCommented:
Look at an inline style of a div inside div#newslide1. Your JavaScript gradually modifies opacity there. I believe this is the reason for the effect of becoming fatter.
0
Amanda WatsonWeb DeveloperAuthor Commented:
Do you know how I can fix this please?
0
LZ1Commented:
Is the module working correctly?  As of right now in both IE & FF I am seeing 2 of the same images and text.
0
The Ultimate Tool Kit for Technolgy Solution Provi

Broken down into practical pointers and step-by-step instructions, the IT Service Excellence Tool Kit delivers expert advice for technology solution providers. Get your free copy for valuable how-to assets including sample agreements, checklists, flowcharts, and more!

Amanda WatsonWeb DeveloperAuthor Commented:
Ah its working properly now.
Seems I put in some javascript that stopped it from working!
Another problem, another question I think...
Anyway can you help with the fat text
0
Amanda WatsonWeb DeveloperAuthor Commented:
not sure how to fix this...help please
0
LZ1Commented:
What I'm seeing cross-browser is that it will load the default font first and then load the special font. This is completely normal when using a special font.
I did not see it become bolder or fatter by any means.
0
NetExpert-WarszawaCommented:
Just comment out the part of JavaScript code responsible for changing the opacity. You will loose the effect of a photo becoming brighter (I do not like it. The photo becomes too bright), but fix the font problem.
0
Amanda WatsonWeb DeveloperAuthor Commented:
Where will I find the javascript responsible for this changing of opacity
0
Amanda WatsonWeb DeveloperAuthor Commented:
Here is the link for the whole module..perhaps you can pinpoint where this is being applied?
http://amandawatson.com.au/download/mod_aku_newslide.zip

Thanks
0
LZ1Commented:
I'm thinking it's in the jquery-cycle.js.  Although there are multiple opacity instances.  There are only a couple that are referencing CSS though.
I'm not sure, but I'm thinking it's this one
 

function(i){var z=first?i>=first?els.length-(i-first):first-i:els.length-i;$(this).css("z-index",z);});$(els[first]).css("opacity",1).show();removeFilter(els[first],opts);if(

Open in new window

0
Amanda WatsonWeb DeveloperAuthor Commented:
I am not at all very good with javacript.

Can you post the entire jquery-cycle.js with what you think will work (with this function omitted?)
0
NetExpert-WarszawaCommented:
Actually this is done in jquery-1.4.1.js in line 113. The function called to make the effect is, as LZ1 has written, cycle() from jquery-cycle.js.

However it is not a good idea to modify the files. If you update jQuery (or Joomla), you will loose the change.

I do not know Joomla, so I do not think I will be able to tell you exactly what to change. What you need to do is not to use jQuery Cycle Plugin (or maybe JT SlideShow). Probably it is as easy as editing properties of a box named newslide1.
0
Amanda WatsonWeb DeveloperAuthor Commented:
I won't be changing the module as the client was super specific about these requirments so I need to keep it.

I simply want the text fattening to stop!  Or somehow make the font lighter than it ends up
0
Amanda WatsonWeb DeveloperAuthor Commented:
If anyone can help me make the font much lighter then the problem will be solved
0
NetExpert-WarszawaCommented:
What the client was specific about? Fading effect? Cycling through articles? Something else?
0
Amanda WatsonWeb DeveloperAuthor Commented:
He was specific in that he wanted to update the articles with heading and text and image and have that cycling through.  This was the only module I could find that had the auto rotate feature with that.

Can you help me reduce the thickness of the font
0
NetExpert-WarszawaCommented:
See the other possible cycling effects - http://jquery.malsup.com/cycle/browser.html
Could you use another one (none?)?
0
Amanda WatsonWeb DeveloperAuthor Commented:
No, I spent hours finding this one and customising it to suit.

I just want the font lighter please
0
LZ1Commented:
Making the font lighter may or may not be possible depending on how it's specified through the CSS and the plugin.  I'm sure your aware of the font-weight attribute.  You could try that and target the text you want.
font-weight:lighter;
http://www.w3schools.com/css/pr_font_weight.asp 
0
Amanda WatsonWeb DeveloperAuthor Commented:
I have used font lighter for this font you will see in the CSS if you use firebug.

I am at a loss here how to rectify this.

Please can anyone offer any other help?
0
NetExpert-WarszawaCommented:
It is a combination of:
1. an element type (h3)
2. a font family
3. a color
4. a size

Use a firebug and play with these settings. For example changing the element type to p or h4 solves the problem (well, . Disabling a color for .newsline h3 solves the problem (well, the text is too dark).

I have not analyzed the plugin. It is possible that making h3 bolder is done by design.
0
LZ1Commented:
I just went through Firebug and unfortunately I don't thnk your going to be able to reduce the thickness of the font.  Fonts are a really good thing to design with, however some attributes of that specific font are just not editable.  
I do believe you have 2 choices:
  1. Choose another font.  I go here for all my fonts: www.fontsquirrel.com
  2. Leave it alone
I'm honestly not sure there is anything else you can do.   How much do you need to reduce it by overall? Can you find a similiar font?
0

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
Amanda WatsonWeb DeveloperAuthor Commented:
Hey there, nothing I did fixed this fat font
0
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
CSS

From novice to tech pro — start learning today.