Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Page 1 of 2 12 LastLast
Results 1 to 15 of 17
  1. #1
    New Coder Ibanez's Avatar
    Join Date
    Nov 2008
    Location
    South Africa
    Posts
    73
    Thanks
    11
    Thanked 0 Times in 0 Posts

    Having a hard time!!

    Hi all!

    Im a bit of a noob and Im having a bit of an issue that I hope somebody could help with.
    I designed website using PNG graphics. As everyone knows, IE is less that friendly when it comes to alpha transparency. So I included an awesome script I found here http://www.twinhelix.com/css/iepngfix/ that enebles IE to render PNG's correctly.

    The issue Im having now is as follows:
    My navbar "got stuck" on overstate in IE (using dreamweaver's script for navbars). I then removed the generic script and did it manually as rollovers.
    What Im left with now is a mouseover and mouseout sate, I'm unable make the onmousedown or onmouseclick work! I believe this is due to the iepngfix script.

    Here is what I have now : <img src="nav/janup.png" name="janup" width="61" height="21" border="0" class="border" onmousedown="this.src'nav/jandown.png';" onmouseover="this.src='nav/jandown.png';" onmouseout="this.src='nav/janup.png';"/>

    Could someone please offer me some advice?
    Sorry to give you a long story aswell
    Thanks!!!

  • #2
    Senior Coder effpeetee's Avatar
    Join Date
    Feb 2007
    Location
    Clapham Junction - London SW
    Posts
    4,885
    Thanks
    228
    Thanked 204 Times in 203 Posts
    We really need all your code.
    * Sources (updated: 21.11.2012.
    Using Windows 8 Professional. 64bit with HP Photosmart 5510 printer Very useful site here.

  • #3
    Supreme Master coder! abduraooft's Avatar
    Join Date
    Mar 2007
    Location
    N/A
    Posts
    14,860
    Thanks
    160
    Thanked 2,223 Times in 2,210 Posts
    Blog Entries
    1
    Let me ask another question.. Why don't you use a CSS based rollover rather than a javascript based one(which is not reliable)?
    The Dream is not what you see in sleep; Dream is the thing which doesn't let you sleep. --(Dr. APJ. Abdul Kalam)

  • #4
    New Coder Ibanez's Avatar
    Join Date
    Nov 2008
    Location
    South Africa
    Posts
    73
    Thanks
    11
    Thanked 0 Times in 0 Posts
    Here is my code effpeetee
    (I know its messy hehe, it was done in dreamweaver)

    <table align="left" border="0" cellpadding="0" cellspacing="0" width="61">
    <tr>
    <td><img src="nav/garden_r1_c2.png" alt="" name="garden_r1_c2" width="61" height="61" border="0" id="garden_r1_c2" /></td>
    </tr>
    <tr>
    <td><a href="pages/jan.html" target="garden"><img src="nav/janup.png" name="janup" border="0" onmousedown="this.imgsrc='nav/jandown.png'" onmouseover="this.src='nav/jandown.png';" onmouseout="this.src='nav/janup.png';"/></a></td>
    </tr>
    <tr>
    <td><a href="pages/feb.html" target="garden"><img src="nav/garden_r3_c2.png" class="border" onmouseover="this.src='nav/garden_r3_c2_f2.png'" onmouseout="this.src='nav/garden_r3_c2.png'" /></a></td>
    </tr>
    <tr>
    <td><a href="pages/march.html" target="garden"><img src="nav/garden_r4_c2.png" class="border" onmouseover="this.src='nav/garden_r4_c2_f2.png'" onmouseout="this.src='nav/garden_r4_c2.png'"/></a></td>
    </tr>
    <tr>
    <td><a href="pages/april.html" target="garden"><img src="nav/garden_r5_c2.png" alt="" name="garden_r5_c2" width="61" height="21" border="0" id="garden_r5_c2" onmouseover="this.src='nav/garden_r5_c2_f2.png'" onmouseout="this.src='nav/garden_r5_c2.png'" /></a></td>
    </tr>
    <tr>
    <td><a href="pages/may.html" target="garden"><img src="nav/garden_r6_c2.png" alt="" name="garden_r6_c2" width="61" height="21" border="0" id="garden_r6_c2" onmouseover="this.src='nav/garden_r6_c2_f2.png'" onmouseout="this.src='nav/garden_r6_c2.png'" /></a></td>
    </tr>
    <tr>
    <td><a href="pages/june.html" target="garden"><img src="nav/garden_r7_c2.png" alt="" name="garden_r7_c2" width="61" height="21" border="0" id="garden_r7_c2" onmouseover="this.src='nav/garden_r7_c2_f2.png'" onmouseout="this.src='nav/garden_r7_c2.png'" /></a></td>
    </tr>
    <tr>
    <td><a href="pages/july.html" target="garden"><img src="nav/garden_r8_c2.png" alt="" name="garden_r8_c2" width="61" height="21" border="0" id="garden_r8_c2" onmouseover="this.src='nav/garden_r8_c2_f2.png'" onmouseout="this.src='nav/garden_r8_c2.png'" /></a></td>
    </tr>
    <tr>
    <td><a href="pages/aug.html" target="garden"><img src="nav/garden_r9_c2.png" alt="" name="garden_r9_c2" width="61" height="21" border="0" id="garden_r9_c2" onmouseover="this.src='nav/garden_r9_c2_f2.png'" onmouseout="this.src='nav/garden_r9_c2.png'" /></a></td>
    </tr>
    <tr>
    <td><a href="pages/sep.html" target="garden"><img src="nav/garden_r10_c2.png" alt="" name="garden_r10_c2" width="61" height="21" border="0" id="garden_r10_c2" onmouseover="this.src='nav/garden_r10_c2_f2.png'" onmouseout="this.src='nav/garden_r10_c2.png'" /></a></td>
    </tr>
    <tr>
    <td><a href="pages/oct.html" target="garden"><img src="nav/garden_r11_c2.png" alt="" name="garden_r11_c2" width="61" height="21" border="0" id="garden_r11_c2" onmouseover="this.src='nav/garden_r11_c2_f2.png'" onmouseout="this.src='nav/garden_r11_c2.png'" /></a></td>
    </tr>
    <tr>
    <td><a href="pages/nov.html" target="garden"><img src="nav/garden_r12_c2.png" alt="" name="garden_r12_c2" width="61" height="21" border="0" id="garden_r12_c2" onmouseover="this.src='nav/garden_r12_c2_f2.png'" onmouseout="this.src='nav/garden_r12_c2.png'" /></a></td>
    </tr>
    <tr>
    <td><a href="pages/dec.html" target="garden"><img src="nav/garden_r13_c2.png" alt="" name="garden_r13_c2" width="61" height="21" border="0" id="garden_r13_c2" onmouseover="this.src='nav/garden_r13_c2_f2.png'" onmouseout="this.src='nav/garden_r13_c2.png'" /></a></td>
    </tr>
    <tr>
    <td><img src="nav/garden_r14_c2.png" alt="" name="garden_r14_c2" width="61" height="62" border="0" id="garden_r14_c2" /></td>
    </tr>
    </table>

    I'm a beginner and I dont really know how abduraooft. :-/
    Would it not interfere with the iepngfix?

  • #5
    New Coder Ibanez's Avatar
    Join Date
    Nov 2008
    Location
    South Africa
    Posts
    73
    Thanks
    11
    Thanked 0 Times in 0 Posts
    Dunno if links are allowed here but the url to my site is here http://www.hadeco.co.za/

  • #6
    Supreme Master coder! abduraooft's Avatar
    Join Date
    Mar 2007
    Location
    N/A
    Posts
    14,860
    Thanks
    160
    Thanked 2,223 Times in 2,210 Posts
    Blog Entries
    1
    Hi Ibanez, I'd recommend you to read "Why tables for layout is bad?"
    The Dream is not what you see in sleep; Dream is the thing which doesn't let you sleep. --(Dr. APJ. Abdul Kalam)

  • #7
    Regular Coder Doctor_Varney's Avatar
    Join Date
    Mar 2008
    Location
    Midlands, UK
    Posts
    649
    Thanks
    45
    Thanked 29 Times in 28 Posts
    Quote Originally Posted by Ibanez View Post
    Here is my code effpeetee
    (I know its messy hehe, it was done in dreamweaver)

    I'm a beginner and I dont really know how abduraooft. :-/
    Would it not interfere with the iepngfix?
    Yes sir, it is possible to style your menu with CSS, using images in the hover part. This is much more efficient and reliable than using Javascript and especially, Dreamweaver produces very inefficient code. A quick search or perhaps take a look at the W3C Webschools should put you right on this.

    Don't worry too much about the fact your code is messy for now. Of course, tables are just messy anyway, though looking towards some simpler CSS to position your elements, will bode well for the future. That all depends on how often you need to edit your site.
    Definition: Computer rage is a heightened physiological response with associated feelings of anger and frustration[1] resulting from using a computer or other complex electronic device. It may result in the physical assault of the computer or similar item.[2] Computer use often leads to verbal abuse and occasionally physical violence towards the object.[3] Computer rage may be caused by distress due to a hardware or software problem which the enraged person is unable to correct.

  • Users who have thanked Doctor_Varney for this post:

    Ibanez (11-17-2008)

  • #8
    Regular Coder Doctor_Varney's Avatar
    Join Date
    Mar 2008
    Location
    Midlands, UK
    Posts
    649
    Thanks
    45
    Thanked 29 Times in 28 Posts
    Quote Originally Posted by abduraooft View Post
    Hi Ibanez, I'd recommend you to read "Why tables for layout is bad?"
    Meaning absolutely no offence at all, towards Abduraooft; though I'd advise caution with answers like this. Although the information within is absolutely correct and the poster is absolutely right to lead you there, if you know no CSS as yet, you could be in for a long and steep learning curve, which could set you back, if you need your site to move along quickly for now.

    Take a look at transitional design to begin with(described at the above link). For instance, you can still style tables, relatively efficiently in CSS - at least, better than you can with Dreamweaver. I'd advise to start by enhancing your HTML with some inline styles and later step this up, gradually, into a full CSS design, when you have the chance to sit down and learn fully, with few distractions.

    You should be able to bring some menu styling in, which I think will be a great introduction to using CSS, whilst creating you a very nice little menu system, without the convoluted and unreliable mess of DW Javascript.

    Unless, of course, you have the desire to put your site's progress on a backburner for a little while and devote some time to learning the concepts of CSS before re-launching. It's up to you.

    But DO be sure to read the excellent article Abdura links to. It's very worthwhile to discover how much work you could save yourself in the longterm scheme of things.

    Just my opinion.... Take it or leave it.

    Hope this helps in some way,
    Last edited by Doctor_Varney; 11-14-2008 at 11:46 AM.
    Definition: Computer rage is a heightened physiological response with associated feelings of anger and frustration[1] resulting from using a computer or other complex electronic device. It may result in the physical assault of the computer or similar item.[2] Computer use often leads to verbal abuse and occasionally physical violence towards the object.[3] Computer rage may be caused by distress due to a hardware or software problem which the enraged person is unable to correct.

  • #9
    New Coder Ibanez's Avatar
    Join Date
    Nov 2008
    Location
    South Africa
    Posts
    73
    Thanks
    11
    Thanked 0 Times in 0 Posts
    I've heard that tables are the root of all evil abduraooft, but I would rather have a root canal done than to rebuild this site AGAIN (you have no idea how many times I had to do this)

    Doc_V the site will change on a monthly basis. I have used CSS alot in the site, to make my life easier when I have to change it, but as for menu's I have alot more to learn. I know the site is flawed in many many ways, but apart from that... Is there simply NO way to add a down state...? I just cant spend more time on this to rebuild the site...

  • #10
    Regular Coder Doctor_Varney's Avatar
    Join Date
    Mar 2008
    Location
    Midlands, UK
    Posts
    649
    Thanks
    45
    Thanked 29 Times in 28 Posts
    Quote Originally Posted by Ibanez View Post
    Is there simply NO way to add a down state...? I just cant spend more time on this to rebuild the site...
    Believe me, Ibanez, I Do sympathise with your position here. I know how frustrating it can be, when all you want is a swift fix to a problem.

    However, I'm sure that by rooting out the mouseover states from the Dreamweaver document, you can bring in a simple CSS menu. The code is really not all that complex to create the image-swapping effect you desire.

    But hang on...

    I've had a look and to be honest, it seems to work very nicely, both in Firefox and IE. The menu text expands and turns red when mouseovered and stays red, when clicked and the links all seem to be operating correctly. I do apologise if this seems like a stupid question, but what exactly is the problem?

    Regards,
    Last edited by Doctor_Varney; 11-14-2008 at 12:05 PM.
    Definition: Computer rage is a heightened physiological response with associated feelings of anger and frustration[1] resulting from using a computer or other complex electronic device. It may result in the physical assault of the computer or similar item.[2] Computer use often leads to verbal abuse and occasionally physical violence towards the object.[3] Computer rage may be caused by distress due to a hardware or software problem which the enraged person is unable to correct.

  • #11
    New Coder Ibanez's Avatar
    Join Date
    Nov 2008
    Location
    South Africa
    Posts
    73
    Thanks
    11
    Thanked 0 Times in 0 Posts
    Yeah you right!!
    Ok so Im gonna go muck with CSS now and try to get this fixed by the end of the day...
    Ill let you know how it went ;-)
    So let me just make sure Doc... This will in no way mess with the IEPNGFIX script? Because I really need that to work more than anything! What I mean is Does CSS not interfere with JS?
    Oh and thanks for the advice dude!

  • #12
    Regular Coder Doctor_Varney's Avatar
    Join Date
    Mar 2008
    Location
    Midlands, UK
    Posts
    649
    Thanks
    45
    Thanked 29 Times in 28 Posts
    Quote Originally Posted by Ibanez View Post
    So let me just make sure Doc... This will in no way mess with the IEPNGFIX script?
    Well, I wouldn't like to say for sure, but I very much doubt it. All CSS does is style the elements you put in your HTML. It's not scripting, so no reason for it to interfere with any scripting you do have, although with CSS image swapping in your links, you won't need any scripts at all.

    Quote Originally Posted by Ibanez View Post
    Because I really need that to work more than anything!
    Um... What exactly does it DO? What's the effect you're after? Did you know, you can actually apply translucency, via filters in CSS (if that's what you're after)? Though how well supported it is, I'm unsure.

    Quote Originally Posted by Ibanez View Post
    What I mean is Does CSS not interfere with JS?
    It shouldn't do. Do what I do, and make a testing folder. Reproduce your site there and work on isolated parts of it.

    If you need a good code editor, for manual coding, try this.

    Quote Originally Posted by Ibanez View Post
    Oh and thanks for the advice dude!
    No problem. I had no idea how much CSS knowledge you already had. More than I thought.

    As it is, the site does look pretty damn good, to my eyes. If it's just a slight visual enhancement you want, remember - what the viewer does not see, he does not grieve over.

    Good luck!
    Last edited by Doctor_Varney; 11-14-2008 at 12:35 PM.
    Definition: Computer rage is a heightened physiological response with associated feelings of anger and frustration[1] resulting from using a computer or other complex electronic device. It may result in the physical assault of the computer or similar item.[2] Computer use often leads to verbal abuse and occasionally physical violence towards the object.[3] Computer rage may be caused by distress due to a hardware or software problem which the enraged person is unable to correct.

  • #13
    Supreme Master coder! abduraooft's Avatar
    Join Date
    Mar 2007
    Location
    N/A
    Posts
    14,860
    Thanks
    160
    Thanked 2,223 Times in 2,210 Posts
    Blog Entries
    1
    Quote Originally Posted by Doctor_Varney
    Meaning absolutely no offence at all, towards Abduraooft; though I'd advise caution with answers like this. Although the information within is absolutely correct and the poster is absolutely right to lead you there, if you know no CSS as yet, you could be in for a long and steep learning curve, which could set you back, if you need your site to move along quickly for now.
    The actual title of that page is
    Why tables for layout is stupid: problems defined, solutions offered
    The Dream is not what you see in sleep; Dream is the thing which doesn't let you sleep. --(Dr. APJ. Abdul Kalam)

  • #14
    Regular Coder Doctor_Varney's Avatar
    Join Date
    Mar 2008
    Location
    Midlands, UK
    Posts
    649
    Thanks
    45
    Thanked 29 Times in 28 Posts
    Like I said, Abdura, no offence - and I think it's a great place to start, too, because it does offer solutions.

    However, if you know tables and you've got a limited deadline, it can be just as stupid to drop all you know and dive into CSS. I know, because I did exactly this, thinking I could tackle the project quickly. How wrong I was. Steep learning curve and I only just got away with it, but I like to think I've come out of it, better.... Albeit slightly mad...

    Thankfully, the staff in this here asylum have been very helpful.
    (I get by with a little help...)

    Regards,
    Definition: Computer rage is a heightened physiological response with associated feelings of anger and frustration[1] resulting from using a computer or other complex electronic device. It may result in the physical assault of the computer or similar item.[2] Computer use often leads to verbal abuse and occasionally physical violence towards the object.[3] Computer rage may be caused by distress due to a hardware or software problem which the enraged person is unable to correct.

  • #15
    Regular Coder
    Join Date
    May 2008
    Location
    Lost in Localhost...
    Posts
    702
    Thanks
    3
    Thanked 43 Times in 42 Posts
    Quote Originally Posted by Doctor_Varney View Post
    Meaning absolutely no offence at all, towards Abduraooft; though I'd advise caution with answers like this. Although the information within is absolutely correct and the poster is absolutely right to lead you there, if you know no CSS as yet, you could be in for a long and steep learning curve, which could set you back, if you need your site to move along quickly for now.
    I'm sorry but I have a different opinion about that. I would much rather have a generally better site, by putting more effort into making it. Making it move quickly now, will make it move slower in the future.

    Quote Originally Posted by Ibanez View Post
    I've heard that tables are the root of all evil abduraooft, but I would rather have a root canal done than to rebuild this site AGAIN (you have no idea how many times I had to do this)
    Well I think doing it again would be worth it...Besides, just read on a CSS tutorial, and you won't have to do you're layout again. Just change you're tables to divs. Just try it

    Good luck


  •  
    Page 1 of 2 12 LastLast

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •