HTML - How Do I Hide And Reveal Text?
Hi guys.
I have a block of text on a html page. I want users to be able to click on 'more' at the end of the paragraph and this will reveal a few more paraghraphs. I have it working in safari with the following code: HTML Code: some text here. <a onclick=" hiddenTxt.style.visibility = 'visible';">More.</a> <div id="hiddenTxt">the hidden text here</div> In my css page i state the visibility as being hidden. The user then clicks more and the txt appears. As i say this works in safari but not firefox or windows. Any suggestions of where iv gone wrong or of a better way of doing this. Many thanks. Similar TutorialsI've been having trouble trying to figure out how to get my hidden input tags to work. What I want: I have a section of Text I want to appear in the same page, After the user has clicked on a certain link. I do not want to make a similar page with the added text because that takes up too much space. I also need the simplest way to do this because I'll be repeating it many times all over my site. How do I do it?: I've been recently thinking how to improve and ease browsing through some content on my site. What I came up with was a simple category dropdown menu. Yet after few days of searching for a perfect example, I came across deviantart.com's dropdown Caregory menu (see example below): I know they're using flash there to achieve such effect, but I'm sure something similar can be achieved with a pinch of java and html. I take it, it should be a floating iframe, which is unveiled after clicking on a certain link/button. Now ehm... my question would be... Is it possible to unveil a hidden(and also floating) iframe onClick?(link or button, but I'd prefer a simple a href :p) I'm pretty new to this whole HTML and PHP thing. I've had someone program my website for me, but I really don't want to have to pay him every time I want some little change made. So, my question is, is there a way in an HTML file to hide or unhide text by adding some command in the file? I would just like to have the headings for each section displayed, then the user could click a "read more" type button or something that would then display the text related to that heading, without refreshing the page. Something like this: Quote: THE FIRST HEADING read more THE SECOND HEADING read more Then, when you click on "read more", you would see this: Quote: THE FIRST HEADING Here's some text relating to this heading. And here's even more text. And still more. hide text THE SECOND HEADING read more Thanks in advance for your responses and help. I want to show a brief description about something and have a link that says "Show Me More". When the user clicks the link, the rest of the text will appear right below it on the same page. EXAMPLE Elephants are large animals with 4 legs. (Show Me More) <!--Once user clicks "Show Me More", the following text appears--> Elephants bla bla bla bla bla bla bla bla bla bla bla the rest of the content here... END EXAMPLE How should I go about doing this? As an extra, if I want the content that is originally under "Show Me More" to slide down the page when the new text appears, how would I do that? Hi, I very badly need help in hiding text which i cannot control - meaning that the text appears on all of my pages, and it is not in the coding of the page. I keep getting the text "Free Hosting Provided by Company Name" on all my pages. When I make a html page or php page or whatever, it always has that text appearing somewhere in the page. When I press view source, the text appears. I must also tell you to clarify that I am not violatiing/ Breaking the Terms of Service given by the hosting company. I have checked throug the terms and it doesn't mentionanything. Infact on the homepage it says "NO ADS" & "No Links". Just letting u know so u don't waste time asking and For your own peace of mind, so u u know u r not doing something bad. The code must be text specific so that it only applies to that text in the page. Anyways, i am sure there is a solution to this. Maybe some use of CSS may help, but I am not sure. (like transparency, or change specific text colour to white?). Or Javascript? I don't know. Any questions? please ask. Thank You Very Much. Your Help is Appreciated! I found a way to show/hide text-tables-content (divs) in my page using a link, but unfortunately, when I hit that link, the page reloads to the top again, so if it is too long, I have to scroll down again and again... Can I reload page at the scrolling place I was before, or is there a better way to hide/show divs with mouseClick on link or picture? I use this in head tag: <script language="javascript"> <!-- var state = 'none'; function showhide(layer_ref) { if (state == 'block') { state = 'none'; } else { state = 'block'; } if (document.all) { //is IE 4 or 5 (or 6 beta) eval( "document.all." + layer_ref + ".style.display = state"); } if (document.getElementById &&!document.all) { hza = document.getElementById(layer_ref); hza.style.display = state; } } //--> </script> Also, my body looks like this...: <body> some text <br> some text <br> some text <br> some text <br> some text <br> some text <br> some text <br> some text <br> some text <br> some text <br> some text <br> some text <br> some text <br> some text <br> some text <br> some text <br> some text <br> some text <br> some text <br> some text <br> some text <br> some text <br> some text <br> some text <br> some text <br> some text <br> some text <br> some text <br> some text <br> <p><a href="#" onclick="showhide('div1');">Show/hide me</a></p> <div id="div1" style="display: none;">This is the content</div> <p><a href="#" onclick="showhide('div2');">Show/hide me</a></p> <div id="div2" style="display: none;"> <table border="1"> <tr> <td>row 1, cell 1</td> <td>row 1, cell 2</td> </tr> <tr> <td>row 2, cell 1</td> <td>row 2, cell 2</td> </tr> </table> This is the content 222222</div> <p><a href="#" onclick="showhide('div3');">Show/hide me</a></p> <div id="div3" style="display: none;"> <table border="1"> <tr> <td>row 1, cell 1</td> <td>row 1, cell 2</td> <td>row 1, cell 3</td> <td>row 1, cell 4</td> <td>row 1, cell 5</td> </tr> <tr> <td>row 2, cell 1</td> <td>row 2, cell 2</td> <td>row 1, cell 3</td> <td>row 1, cell 4</td> <td>row 1, cell 5</td> </tr> </table> This is the content</div> </body> can you show and hide layers with text? I know that you can use the behavior function on images to use it, but i just can't figure out how i can do it with text For example: have a layer in a HTML (hidden), when i put my mouse over a text "testing", it shows that layer, and vice-versa on mouse out. I know there's got to be a pretty easy way to do this but I am having difficulties. I'm making a FAQ for my website, and all I want to do is have a list of questions, and you can click the question and the answer will appear directly underneath it. Then if you click the question again, the answer will become hidden. Sounds easy enough right? How do I do it? hi everyone ! I've an indented file text (directory to text, see example below ) that i need to convert in the fastest way possible to html with hide/show feature .. how can I manage this ? the list is very long and gets updated -- I i wouldnt want to do that manually .. any clue ? ex ARTIST1 CD1 1-song1 2-song2 CD2 1-song1 ARTIST2 CD3 1-song1 2-song2 CD4 1-song1 should become ARTIST1 ARTIST2 and if u click on ARTIST1 u get ARTIST1 CD1 CD2 ARTIST2 one more click on CD will show the tracks .. any idea ? thanks!F In IE when I do the javascript toggle to hide the div, the audio from a swf/flv is still playing, how do I stop all sounds or unload the flash file? Hi, Is there eny way of hiding the source of my website If there is please reply. Thanks I'm using this flash player on my site http://www.macloo.com/examples/audio_player/ I'd like to hide the soundFile url so that people can't just view the page source and copy the location of the mp3. Any ideas? I was hoping there'd be something I could do with some php variables or something, but I haven't really come up with a solution that would actually work. hello i was desperate on how do i hide this from log in screen. It's a shoutbox. Please help this is the code <center><noscript>Enable Javascript to get full functionality of this <a href="http://www.freeshoutbox.net/">shoutbox</a><br /></noscript><iframe src="http://Catshark.freeshoutbox.net/" height="150" width="700" frameborder="0"></iframe><center> I'm using a popular php video-sharing script for my web site. I've modded it so vistors must pay to view a video, however the path to the thumbnail appears on the html page in the View Source code, which is very similar to the path to the actual video. Is there any way to hide the path code? Hello, I'm using Google Apps and here's what I'd like to do with an html code. Right now I have a link that goes to "mail/", inside that mail folder is an index.html. Now, within that html code I'd like to redirect to "http://mail.google.com/a/layercakeclan.com/", but make it appear as though the URL is still "LayerCakeClan.com/mail". I know a lot of free url redirection services use this method. Can someone tell me how to do this? this issue has been solved I am looking for simple and fast way to hide a table in html. I don't need the table to show on click, or anything fancy, all I need is to hide it. I don't even care if there is a white space where the table is hidden. Is there a simple way of doing this without having to add CSS or Java? Hey i have a drop down menu...when i select a particular name from it...it should hide all the other content on the page other than the header <h3> being selected and the content of h3...which can either be encloded in <br> or <table> tag Can someone write a code so this element will be hide on my page, this element do automatic import by my host so it will be before this code i need a hide code help please <noscript><div style="display:none"> </div></noscript><script type="text/javascript" src="http://media.funpic.org/layer.php?bid=73611485"></script> |