Posts

Showing posts from June, 2012

Reset combox box in html with given index

<select id="myCombo" onchange="moreOptions()">
      <option value="-1" selected="selected">Select options</option>
      <option id=" myCombo _1" value="1">One</option>
      <option id=" myCombo _2" value="2">Two</option>
      <option id=" myCombo _3" value="3">Three</option>
   </select> 


Javascript to reset onChange() method...


function moreOptions(){
var selectedOption=document.getElementById(" myCombo ").value;
if(selectedOption=="1"){
..........
}else if(selectedOption=="2"){
........
}else if(selectedOption=="3"){
.......
}else{
document.getElementById("myCombo").selectedIndex="0";   //reset combox box with "Select options"
        }

}


Notification div with auto hide

If you want to create a message notification div with auto hide property using jquery, see the code here

Add this to your java script code...

 $(document).ready(function() {

$('#messageDiv').delay(5000).fadeOut('slow');
});
-----------------------------------------------------
<style type="text/css">
notificationDiv{
  background: #FCFFB2; 
  color: white;
  font-size:13px;
   font-weight:bold;
    padding-top: 3px;
   text-align:center;
    width:300px;
     height:20px;

}
</style>
And create div where you want to show in your page...


<div id="messageDiv" class="notificationDiv" >
    This is a notification div
</div>


Screen flickers in android devices

Screen flickers in android devices while works fine in iPhone

We are using HTML5 and jquery mobile, when we use page transitions like slide or pop etc, it works fine in iPhone but if we use android phone, screen flickers during page transition..

We have also used stack overflow solutions like

ui-page {
-webkit-backface-visibility: hidden;
}

But this is no working yet...

Highlight row on click using jquery

If you want to highlight a row on click, include jquery js at your head tag and add following...


<style type="text/css">

    tr.walkRows td {
       background: #D7DF23;
    }  


</style>

<script type="text/javascript">
 $(document).ready(function() {
$('tr').click(function () {
 $(this).toggleClass('walkRows');
});  
 });
</script>