|
HTML - Can't Get Expandable/collapsible Div Text To Work In Firefox
I am very new to programming and untrained, so I used a sample I found to create expandable/collapsible text. It works in IE, but not Firefox. Here is the link to a simplified version, which expands when you click on it in IE, but does nothing in Firefox.
http://www.projusticemn.org/library/attachment.193408 Any help is greatly appreciated! Similar TutorialsWhy Does Alt Text in the html img Tag Not Work in Firefox？ It works well in IE but not in Firefox. Anyone knows why? Thanks in advance. Was testing it a little...works great...finally got it to work... But the problem Im having now is the page doesn't stay still when I use the dropdowns... For example I had a table with two columns and on the right columns Iam using the drop downs, which works great...but the left side of the column (the content) shifts, when I use the drop down. anyway to avoid this? i JUST WANT the content on the left the not move because of the drop down "dropping"... You know what I mean? I've seen this done on other sites, but have no idea how they got the page to stay still when one side is dropping down... I have a problem with my html coding somewhere, and I can't figure it out. It works in IE and Chrome, but not in Firefox, and I need it to work in all browsers. Here's the link: http://kcldancesoc.co.uk/?page_id=711 You can see the source, if you're browsing in anything buy Firefox it should work.. I can't figure out why it won't in mozilla. Any ideas I'd really appreciate the help. At the top of http://www.eastofedenevents.com/, the nav buttons all change except the "location" one-- It will not highlight in Firefox, on my Mac. It works fine in Safari, on a mac. Why is this? Thank you. Is it possible to get this website to work in Firefox? When the window gets minimized smaller, it's supposed to stretch to fit the new screen (in IE it works) but in Firefox it doesn't resize right... is there any way for it to work in FireFox? http://www.clockwork-chaos.com/paperclover Hello all, I use Internet Explorer 7 which is also the browser I preview my layouts on. I've had problems with my layouts looking like they should on Firefox for the longest time and I think it's time I tried correcting the problem. When I load my blog on Firefox the entry box overlaps with a portion of the image. The entry box's height is also too long on Firefox. I do know that coloured scrollbars don't show up on Firefox so that's not a problem. My main issue is that the basic arrangement of the boxes of my layout is completely messed up on Firefox. Here's the HTML: Quote: <html> <head> <title>o.d.c v41: i am more than you will see.</title> <style type="text/css"> A:link { text-decoration: none; font-weight: bold; color: #924146 } A:visited { text-decoration: none; font-weight: bold; color: #924146 } A:active { text-decoration: none; color: #000000 } A:hover { text-decoration: line-through; cursor: default; color: #000000 } body {background-color: #E6DDD0; scrollbar-face-color: #E6DDD0; scrollbar-highlight-color: #E6DDD0; scrollbar-3dlight-color: #E6DDD0; scrollbar-shadow-color: #E6DDD0; scrollbar-arrow-color: #E6DDD0; scrollbar-track-color: #E6DDD0; scrollbar-darkshadow-color: #E6DDD0; font-family: tahoma; color: #000000; text-align:justify; margin: 0px; font-size: 8pt;} .entry {position: absolute; top: 80px; left: 163px; width: 514px; height: 481px; border-left: 1px solid #52191D; border-right: 1px solid #52191D; border-top: 1px solid #52191D; border-bottom: 1px solid #52191D; padding: 10px; letter-spacing: 0pt; line-height: 9pt; overflow:auto; background-color: #D9B8AE; scrollbar-face-color: #D9B8AE; scrollbar-highlight-color: #000000; scrollbar-3dlight-color: #D9B8AE; scrollbar-shadow-color: #000000; scrollbar-arrow-color: #D9B8AE; scrollbar-track-color: #D9B8AE; scrollbar-darkshadow-color: #D9B8AE;} .image {position: absolute; top: 50px; left: 680px; border-left: 0px solid #52191D; border-right: 0px solid #52191D; border-top: 0px solid #52191D; border-bottom: 0px solid #52191D;} .links {position: absolute; top: 50px; left: 163px; width: 514px; height: 10px; border-left: 1px solid #52191D; border-right: 1px solid #52191D; border-top: 1px solid #52191D; border-bottom: 1px solid #52191D; padding: 6px; text-align: center; background-color:#D9B8AE;} </style> <script type="text/javascript" src="http://www.haloscan.com/load/tripwires"> </script> </head> <body> <div class="image"> <img src="http://img.photobucket.com/albums/v628/yelen/mewithtext.jpg"> </div> <div class="entry"> <center><font color=#BC6A6F><b><u>%%short_description%%</u></b></font></center> <p align="right"><i>written: %%time%% on %%date%%</i></p> <P> %%entry%% <P><P><P><P> <P align="right"> <font size=1.5><a href="javascript:HaloScan('%%page_name%%');" target="_self"><script type="text/javascript">postCount('%%page_name%%');</script></a></font> <P><P> <p align="center"><a href="%%prev%%">previous entry</a> || <a href="%%next%%">next entry</a> <P><center><hr width=90% noshade color=#000000 HR size="1"></center><P> <b> Previously:</b><br> %%older_entries%%<P> <br> <P align="center"> <!--WEBBOT bot="HTMLMarkup" startspan ALT="Site Meter" --> <script type="text/javascript" language="JavaScript">var site="s13cyelen"</script> <script type="text/javascript" language="JavaScript1.2" src="http://s13.sitemeter.com/js/counter.js?site=s13cyelen"> </script> <noscript> <a href="http://s13.sitemeter.com/stats.asp?site=s13cyelen" target="_top"> <img src="http://s13.sitemeter.com/meter.asp?site=s13cyelen" alt="Site Meter" border=0></a> </noscript> <!-- Copyright (c)2002 Site Meter --> <!--WEBBOT bot="HTMLMarkup" Endspan --> <!-- Begin Nedstat Basic code --> <!-- Title: like i could care --> <!-- URL: http://offence.diaryland.com --> <script language="JavaScript" src="http://m1.nedstatbasic.net/basic.js"> </script> <script language="JavaScript"> <!-- nedstatbasic("ABZB6g7C7XYY5+UwEEa7SkNbtBHg", 0); // --> </script> <noscript> <a target="_blank" href="http://v1.nedstatbasic.net/stats?ABZB6g7C7XYY5+UwEEa7SkNbtBHg"><img src="http://m1.nedstatbasic.net/n?id=ABZB6g7C7XYY5+UwEEa7SkNbtBHg" border="0" nosave width="18" height="18"></a> </noscript> <!-- End Nedstat Basic code --><P> </div> <div class="links"> <a href="http://offence.diaryland.com/index.html">new</a> <a href="http://offence.diaryland.com/older.html">old</a> <a href="http://offence.diaryland.com/bio.html">bio</a> <a href="http://offence.diaryland.com/omake.html">extras</a> <a href="http://offence.diaryland.com/layout.html">layout</a> <a href="http://members.diaryland.com/edit/notes.phtml?user=offence">notes</a> <a href="mailto:yelen.dean14[at]gmail.com">email</a> <a href="http://offence.diaryland.com/poetry.html">poetry</a> <a href="http://www.fanfiction.net/~hisashilovesyelen" target="_blank">fanfiction</a> <a href="http://www.fictionpress.com/~hisashilovesyelen" target="_blank">originals</a> <a href="http://offence.diaryland.com/faveentries.html">favourites</a> <a href="http://www.diaryland.com">host</a> </div> </body> </html> Here's the link to my blog: http://offence.diaryland.com I have VERY basic knowledge of HTML, as I'm sure is obvious. Any help is, therefore, greatly appreciated. Hi, I am new to this borad, hope someone good at HTML can help me. I am building a website www.blazeauto.co.uk/shop/ there is a problem with the navigation menu. It work perfects in Firefox and Safari but not in IE. The following are the code I use. <ul id="mainmenu-nav"> <ul class="ul-nav" <li class="li-nav"><a href="index.php?act=viewCat&catId=1" class="txtDefault">Test Category</a></li> </ul> <ul class="ul-nav" <li class="li-nav"><a href="index.php?act=viewCat&catId=2" class="txtDefault">Level1</a></li> </ul> <ul class="ul-nav" <li class="li-nav"><a href="index.php?act=viewCat&catId=4" class="txtDefault">Level2</a></li> </ul> <ul class="ul-nav" <li class="li-nav"><a href="index.php?act=viewCat&catId=5" class="txtDefault">Level3</a></li> </ul> </ul> And this is the CSS code .li-nav a{ font-size: 14px; width: 150px; display: block; text-indent: 2px; font-family: "Trebuchet MS", Verdana, Arial; color: #000000; text-decoration:none; font-weight: bold; background-image:url(/shop/img/linkout.gif); } .li-nav a:hover{ width: 150px; display: block; text-indent: 2px; font-family: "Trebuchet MS", Verdana, Arial; color: #FFFF00; text-decoration:none; background-color: #0066FF; background-image:url(/shop/img/linkover.gif); ----------------------- Can anyone tell me what is wrong? I have been trying for two days with no luck. Thanks Per Hi all, Before I pour cold water onto Mozilla's FireFox to melt it's flames and kill it, I've a question : Quote: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional //EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> <title>Tables 14</title> </head> <body> <table border="1" width="80%"> <colgroup span="3" align="right" /> <tr> <th>Column 1</th> <th>Column 2</th> <th>Column 3</th> </tr> </table> </body> </html> As you can see, there's 3 columns and I'm using <colgroup span..../> to mass-align the cells to the right. However, when I preview it in FireFox, there's no effect. In Internet Explorer, the cells are right-aligned(which is correct). I also tried doing the CSS equivalent, but FireFox still fails. When I tried changing some other settings, like : <colgroup span="3" style="background-color:red;" />, FireFox renders the code correctly. Seems that FireFox doesn't like to right-align text in columns, eh? Thanks! Xeon. Hi, pretty new to HTML, any help would be greatly appreciated. My links back to my home page etc e.g. my menu links that link to my root folder work fine in IE but when I try opening them in firefox or Flock none of my links work including my link to my CSS style Sheet. Heres an example of my code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"> <head> <title>Anime</title> <link rel="stylesheet" type="text/css" href=" /anime2.css"/> </head> <body> <div class="header"> <div class="logo"> <a href="/Anime.html"> <img src="/anime.png" alt-"Anime Hub" style="border-style:none"/> </a> </div> </div> <div class="menu"> <ul> <li> <a href="/anime.html"> Home </a> </li> <li> <a href="/animenews.html"> News </a> </li> <li> <a href="/animes.html"> Animes </a> </li> <li> <a href="/animepreviews.html"> Previews </a> </li> <li> <a href="/animeblog.html"> Blog </a> </li> <li> <a href="/animeforums.html"> Forums </a> </li> </ul> </div> Im using a forward slash for the link to search in my root folder, if I use ../../ to go back two folders it seems to work, but this is tedious and I am sure there must be another way. Please Help Thanks in advance My website is http://www.unofficialguildwars.com Only just started it and it works fine in every browser except firefox. Ive checked the html i see no problems with it. Really confused on this one, any help would be great. I'm an HTML novice in desperate need of an HTML expert. I paid a guy a lot of money to convert my website over from a Microsoft server to a Linux server and the results were mixed. The text links work in Internet Explorer but not in Firefox. http://www.colorado-carpet-masters.com/carpetcleaningBoulder.php I tried taking them out of a table with no luck. For some reason Firefox reads the links as regular HTML instead of a Hyperlink. Never mind you guys were wrong as usual. Thanks. Is it at all possible to set an IFRAME to a minimum height but give it a variable maximum? In essence I want the IFRAME to expand dependent what is in that frame but never go smaller then a set minimum value Cheers Ian How do I make an expandable list? Example: not clicked: +link1<br> +link2<br> +link3 link2 clicked: +link1<br> +link2<br> -<a href="2-1.html">link2-1</a><br> -<a href="2-2.html">link2-2</a><br> link3 Hey guys! I've just realized my first site html5 and all it was ok about indeed the on-line publishing on my server. Indeed every test made on the local disk were good without Firefox does not read the audio and video files. It works with Google Chrome and Safari but not Firefox. I am anxious to specify that I'm under Mac Os X and that I converted well files in format OGG and that I am rather a graphic designer who try write some code. I try to find the solution for several days but unsuccessfully. Can anybody help me please? Here is the fragment of the code: HTML Code: <!-- Track 01 --> <div> <h3>Fall</h3> <div class="mp_options"> <span class="mp_play">Play</span> <span class="mp_addpl">Add to playlist</span> </div> <div class="mp_song_info" style="display:none;"> <span class="mp_song_title">Fall</span> <span class="mp_mp3">music/album1/Red_Fish_Fall.mp3</span> <span class="mp_ogg">music/album1/Red_Fish_Fall.ogg</span> </div> </div> <!-- Track 02 --> I have a horizontal bar image that has been sliced so it is an iframe. The iframe's source is links.htm (as the horizontal bar is a link bar) so that I can change my site's main links if I have to. Anyways, the problem is this, my link bar looks perfect in firefox but as soon as I view the site in explorer the text doesn't fit in the iframe and there are arrows as if you have to scroll down to view the text. Here is an image of what I mean: Let me know if I should add information. is it possible to include an expandable background image in CSS or Javascript in a simple HTML or XTML page the background for the WHOLE page, not inside a table or cell here an example in flash: http://www.wowlab.net/wow/system01.html I hope this is simple and that simple questions are welcome. I am making a web site and it will have a menu at the top. Just below that i want to put a narrow band of color that goes to the ends of the page with no border, etc. Just runs to the very edge. I'd call it a line but a thick one, maybe 1/2 inch. Regardless of browser or browser size I want it to run to either end of the page. There will be no text or graphics in this color band. How can I do this, I've searched the web but not sure I'm framing the search correctly to get the correct answer. Thanks! Susan Hi, I have to display the results in 20 columns, in that 14 columns are frozen, rest of them are scrollable, when I give table widht in % then scrollbar presents to view the data in Firefox. If I see the same in IE, it doesnt show all the data, and there is no scrollbar. If I give the table width in px form then to some extent I am able to see the scrollbar in IE, and minimum pixel I had to give is 3000 and above. Is there any common solution to me to fix this so that I can see same both the browsers. We would like to have solution, width in % not in px. Please let me know the solution for this. I have attached the zip file for your reference to see the code, please run in IE and Firefox and check it. Advanced thanks, Venkat hi, I have built a web site but have had to change the way products will be viewed so I looked up the image text feature which was brilliant. it works fine in all browser except for explorer. My code is below for people to view as I know that I have made a mistake but cant see where the problem is, I have highlighted the image text feature in red <HTML> <HEAD> <TITLE>DecTec - Suppliers of quality paint applicators</TITLE> <META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=iso-8859-1"> <META NAME="keywords" CONTENT=" dectec, dec, tec, dec-tec, contractors, decorating, sundries, equipment, supplies, items, sales, seller,"> <META NAME="description" CONTENT="DecTec is a leading supplier of quality paint application and associated products to speacialist contractors and applicators of paints and coatings."> <script language="JavaScript" type="text/JavaScript"> <!-- function MM_swapImgRestore() { //v3.0 var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc; } function MM_preloadImages() { //v3.0 var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array(); var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++) if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}} } function MM_findObj(n, d) { //v4.01 var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) { d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);} if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n]; for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document); if(!x && d.getElementById) x=d.getElementById(n); return x; } function MM_swapImage() { //v3.0 var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3) if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];} } //--> </script> <script src="js/dw_event.js" type="text/javascript"></script> <script src="js/dw_viewport.js" type="text/javascript"></script> <script src="js/dw_tooltip.js" type="text/javascript"></script> <script src="js/dw_tooltip_aux.js" type="text/javascript"></script> <script type="text/javascript"> dw_Tooltip.defaultProps = { wrapFn: dw_Tooltip.wrapImageOverText } dw_Tooltip.content_vars = { L1: { img: 'images/paste_table.jpg', txt: '', w: 100 // width }, L2: { img: 'images/pole_sander_head.jpg', txt: '', w: 100 }, L3: { img: 'images/ladder_rack_tites.jpg', txt: '', w: 100 } } </script> </HEAD> |
|||||||