highlight div on page load?

Question

I want to highlight a div on page load. i could find a solution. But the issue is that it fades out entire content of the div. what i used

$('#searchdiv .highligth').fadeOut(1000);

and the html i have written

                   <div id="searchdiv">
                    <div class="highligth">
                        <table cellspacing="2">
                            <tr>
                                <td>
                                    <a class="anchorText">Filter By:</a>
                                </td>
                                <td>
                                    <asp:ObjectDataSource ID="objLanguage" runat="server" OldValuesParameterFormatString="original_{0}"
                                        SelectMethod="GetLanguage" TypeName="Lang.Repositories.LanguageRepository">
                                    </asp:ObjectDataSource>
                                    <asp:DropDownList ID="dlFilter" runat="server" DataSourceID="objLanguage" DataTextField="LanguageType"
                                        DataValueField="LanguageId" Width="150px" AppendDataBoundItems="True" OnDataBinding="dlFilter_DataBinding"
                                        OnDataBound="dlFilter_DataBound">
                                    </asp:DropDownList>
                                </td>
                                <td>
                                    <asp:Button ID="btnFilter" runat="server" Width="90px" Text="Filter" OnClick="btnFilter_Click" />
                                </td>
                            </tr>
                        </table>
                    </div>
                </div>

for few seconds the div is highlighted and as fadeout is mentioned so the content also fade out and the div becomes empty. How to let those control be visible??

Thanks.

Well of course it would fade out the entire contents of the div, what exactly are you trying to achieve here? Be more specific. — daryl, Jul 15 '11 at 20:48

score 1 · Answer 1 · answered Jul 15 '11 at 20:50

1

Is this what you're looking to do?

 $('.highligth').effect("highlight", {}, 3000);

answered Jul 15 '11 at 20:50

wanovak

6,079
23
32

i tried your code. but i don't see any effect. and i just wanted to hightlight the div for few second but with animation like fadeout. and css for the .highligth{ background-color:White;} – Abhishek Ranjan Jul 15 '11 at 21:14
`highlight` changes the background of the DIV to a yellow-ish green and then fades it out according to the `duration`; here 3000 (3 seconds.) – wanovak Jul 15 '11 at 21:16
i did see the document but when i wrote your code but it didn't show any effect. so only i wrote that. looks like i need to add the css file – Abhishek Ranjan Jul 15 '11 at 21:26
Put the code within `$(document).ready(function(){ ...(hightlight code)... });` – wanovak Jul 15 '11 at 21:29
ok i tried your code with fresh page. i am pasting my code which i tried. – Abhishek Ranjan Jul 15 '11 at 21:48
Doesnt work.i tried this .

Hello Worlds

– Abhishek Ranjan Jul 15 '11 at 21:54

score 1 · Accepted Answer · edited May 20 '16 at 10:05

1

Use fadeOut and fadeIn method,

 $('#searchdiv .highligth').fadeOut(1000).fadeIn(2000);

View Demo: http://jsfiddle.net/rgVTW/

edited May 20 '16 at 10:05

Jaykumar Patel

25,525
12
68
75

answered Jul 15 '11 at 20:50

Pit Digger

9,294
23
74
120

I think this will do. And i have not vote it down. :-) Your solution is better as i not changing any color n all. – Abhishek Ranjan Jul 15 '11 at 21:20

Jovylle Bermudez · Answer 3 · 2020-06-24T15:05:01.603

0

Actually there is a very easy and new way to do this.

just add #:~:text=Highlight%20These

try accessing this link

https://stackoverflow.com/questions/38588721#:~:text=Highlight%20a%20text

edited Jun 24 '20 at 15:05

answered Jun 24 '20 at 14:54

Jovylle Bermudez

710
5
14

score 0 · Answer 4 · answered Jul 15 '11 at 20:50

0

Try this

$('#searchdiv .highligth').css({opacity: 0}).animate({opacity: 0.5 }, 1000);

answered Jul 15 '11 at 20:50

ShankarSangoli

68,720
11
89
123

highlight div on page load?

4 Answers4