Skip to main content

My new Jquery Plugin name is krDailog

This is my new jquery plugin i hope this is use full to you if you require this plugin than contact me

 /*
    krDailog Version 1.0
    Author: krButani
    email: butanikartik1108@gmail.com
*/


Require to use this function
    - bootstrap.css new version
    - bootstrap.js new version
    - jquery.js new version
    - jquery-ui.js new version
    - glyphicons font by bootstrap

# you can use new version of all and also use min file also

# include file first this way

    <link rel="stylesheet" type="text/css" href="css/bootstrap.min.css">
    <link rel="stylesheet" type="text/css" href="css/krDailog.css">
    <script type="text/javascript" src="js/jquery.min.js"></script>
    <script type="text/javascript" src="js/jquery-ui.min.js"></script>
    <script type="text/javascript" src="js/bootstrap.min.js"></script>
    <script type="text/javascript" src="js/krDailog.js"></script>

# Basic

 - first create div and assign a id lik
    <div id="kBoxDemo">
        // what ever content to display here and design you sub site.
    </div>

 - second thing is to implement our method
    <script>
        $(document).ready(function(){
            $('#kBoxDemo').kBox({
                            title: "kartik", // to give the title
                            closeButton: true,
                        });
        });
    </script>

 - You may require to click and open any dialog box than use following.

     <input type="button" name="kbtn" id="kbtn" value="Open Model 1" />
     <script>
         $(document).ready(function(){
                    $('#kBoxDemo').kBox({
                                    title: "kartik", // to give the title
                                    closeButton: true,
                                    show: false,
                    });

                    $('#kbtn').click(function(){
                        $('#kBoxDemo').kBox({open:true}); / / this is also use to close the pannel and re open it.
                    });
         });
     </script>

# attributes

    ## title
        - this is use to give a title of the pannel.

    ## closeButton
        - this is use to display close button that hide or show the pannel to click on it.
        - the close button accept true or false value.
        - by default it is true.

    ## collapseButton
        - this is collapse the pannel
        - this is by default true.
        - it is accept only ture or false value.

    ## width
        - this is set width of pannel
        - this is give in double quotes with px or % etc

    ## height
        - this is set height of pannel
        - this is give in double quotes with px or % etc

    ## show
        - this is set to pannel is visible or not
        - it accept only true or false value.

    ## top, left, right and bottom
        - this is set to possion of pannel top, left, right and bottom.
        - this is give in double quotes with px or % etc







Post a Comment

Popular posts from this blog

Intent demo pass with text demo in Android

First Create Two acitvity layout file name firstscreen.xml second_screen.xml java filename FirstScreen.java SecondScreen.javafirstscreen.xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/firstscreen"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingBottom="@dimen/activity_vertical_margin"
android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
tools:context="com.example.krbutani.intentpasswithdatademo.Firstscreen">

<Button
android:text="Goto Second"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignPare…