Highlight on RollOver using css and javascript

Hi *.*,

My friends always say my taste in designing is not enough Ha ha But i always try to make best out of that he he.

In my current project i planned to do some thing like Highlight a div on mouse-over.

Ajax Model PopUp Extender

Hi *.*,

Before v start building this I prefer u to go through this link.some of common events of this controls are

• TargetControlID - The ID of the element that activates the modal popup
• PopupControlID - The ID of the element to display as a modal popup
• BackgroundCssClass - The CSS class to apply to the background when the modal popup is displayed
• DropShadow - True to automatically add a drop-shadow to the modal popup
• OkControlID - The ID of the element that dismisses the modal popup
• OnOkScript - Script to run when the modal popup is dismissed with the OkControlID
• CancelControlID - The ID of the element that cancels the modal popup
• OnCancelScript - Script to run when the modal popup is dismissed with the CancelControlID
• PopupDragHandleControlID - The ID of the embedded element that contains the popup header/title which will be used as a drag handle
• X - The X coordinate of the top/left corner of the modal popup (the popup will be centered horizontally if not specified)
• Y - The Y coordinate of the top/left corner of the modal popup (the popup will be centered vertically if not specified)
• RepositionMode - The setting that determines if the popup needs to be repositioned when the window is resized or scrolled.

DEMO
 

Showing details on Mouse Over

Hi *.*,

2 I'm showing Some DHTML stuff.Showing details on move over previously i showing image on mouse-over, and also from database too.2day instead of image data. Simple and humble. 

Demo

On HTML

<html xmlns="http://www.w3.org/1999/xhtml">

<head id="Head1" runat="server">

    <script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.5.js" type="text/javascript"></script>

    <script src="http://jquery.bassistance.de/tooltip/jquery.tooltip.js" type="text/javascript"></script>

    <link href="http://jquery.bassistance.de/tooltip/jquery.tooltip.css" rel="stylesheet"

        type="text/css" />

    <script type="text/javascript">

        $(document).ready(function() {

            $(".selector").tooltip({

                track: true,

                delay: 0,

                showURL: false,

                fade: 250,

                bodyHandler: function() {

                    return $($(this).next().html());

                },

                showURL: false

            });

        });

    </script>

    <style type="text/css">

        .tag

        {

            padding: 5px 5px 5px 5px;

            margin: 5px 5px 5px 5px;

            float: left;

        }

    </style>

</head>

<body>

    <form id="form1" runat="server">

    <asp:Repeater ID="dlMinistry" runat="server" >

        <ItemTemplate>

            <div class="tag">

                <a href="#" class="selector">

                    <%#Eval("tag")%></a>

                <div id="tooltip" style="display: none;">

                    <div>

                        <%#Eval("description")%></div>

                </div>

            </div>

        </ItemTemplate>

    </asp:Repeater>

    </form>

</body>

</html>

On Server Side

    protected void Page_Load(object sender, EventArgs e)

    {

        var list = (new[] {

            new { tag = "Simplyasp.net", description = "Welcome To Simplyasp.net" },

            new { tag = "Simplyasp.blogspot.com", description = "Welcome To Simplyasp.net" },

        }).ToList();

        dlMinistry.DataSource = list;

        dlMinistry.DataBind();

    }

I don't think need more documentation over this because it so simple, in-case u need tell me. I will guide u.

Stay Tune...

Have a nice day... 'N happy Coding :)