Question : I'm using check box in form. but when one check box is checked, show the detail div. and when multi check not show the div with jquery.

HTML code:

<input type="checkbox" name="cb1" id="cb1" />
<input type="checkbox" name="cb2" id="cb2" />
<input type="checkbox" name="cb3" id="cb3" />
<input type="checkbox" name="cb4" id="cb4" />
<div id="detail" style="display:none"></div>

Answer :

---------------------------------------------------------------------------------

<html>
<head>
<title>Demo</title>
<script src="js/jquery.min.js"></script>
<script>
    function checkIt(sender) {
        if ($(".checkme:checked").length == 1) {
            $("#detail").css({
                display:"block"
            });
        }
        else {
            $("#detail").css({
                display: "none"
            });
        }
    }
</script>
</head>
<body>
<input type="checkbox" name="cb1" id="cb1" class="checkme" onchange="checkIt(this);"/>
<input type="checkbox" name="cb2" id="cb2" class="checkme"  onchange="checkIt(this);" />
<input type="checkbox" name="cb3" id="cb3" class="checkme"  onchange="checkIt(this);" />
<input type="checkbox" name="cb4" id="cb4" class="checkme"  onchange="checkIt(this);"/>
<div id="detail" style="display: none">I am Here</div>
</body>
</html>

Question : I want to load external link in iframe. But it doesn't work.

Ans :
--------------------------------------------------------------------------------------------------------------------------

You have a problem of "X-Frame-Options' to 'SAMEORIGIN".

Now, What does it(X-Frame-Options' to 'SAMEORIGIN) mean?

Ans: It means that the site owner do not want anybody to open his/her site in iframe because for security point of view it is poor to have a site to be opened in iframe.

You can check out the link : How Can I Bypass the X-Frame-Options: SAMEORIGIN HTTP Header?

Question : How to hide border on the right when you hover on any item?

Ans :
HTML
----------------------------------------------------------------------------------------------------------------------------------

<div style="background-color: #ffffff; padding: 10px; border-bottom: 1px solid #ccc">
    <ul class="monitoring-tabs">
        <li>Item 1</li>
        <li>item 2</li>
        <li class="active">Item 3</li>
        <li>Item 4</li>
    </ul>
</div>

CSS

------------------------------------------------------------------------------------------

<style type="text/css">
    .monitoring-tabs {
        list-style-type: none;
        padding: 0;
        margin: 0;
        clear: both;
        overflow: hidden;
        line-height: 25px;
    }

        .monitoring-tabs li {
            float: left;
            font-size: 13px;
            border-right: 1px solid #ccc;
            padding: 0 17px;
            color: #4e5665;
            line-height: 30px;
        }
            .monitoring-tabs li:hover {
                background-color: #e9eaed;
                border-right: none;
            }

        .monitoring-tabs .active {
            font-weight: bold;
            color: black;
        }
</style>

Cutting Edge JavaScript, CSS, CSS3 and HTML5

Sunday 28 June 2015

Question : I'm using check box in form. but when one check box is checked, show the detail div. and when multi check not show the div with jquery.

Question : I want to load external link in iframe. But it doesn't work.

Question : How to hide border on the right when you hover on any item?

Blog Archive