Keyboard code “KeyCode” and how to use it in JavaScript
To work on HTML5 canvas to develop a tool similar to paint or free draw on an image, JQuery and Javascript are often used on the browser client side to perform simple tasks that would otherwise require a full postback to the server. There’re a set of keycode associated with each character on the keyboard. To use this on your canvas on an html page, add JQuery and JavaScript to detect the key that user pressed as follow: Key Code backspace 8 tab 9 enter…
Displaying scrolling DIV box
Sample for scrolling DIV box. You can scroll horizontally or vertically using overflow-x or overflow-y CSS stylesheet: #preview{ color:#cc0000; font-size:12px; border:1px #ff0000 solid; overflow: auto; white-space: nowrap; width: 300px; } .imgList{ max-height:150px;margin-left:5px; border:1px solid #dedede; padding:4px; /* float:left; //not working in this case if you want div scrolling horizontally */ display: inline-block; /* display:inline; not working in this case */ } HTML page: <div id=’preview’></div> <form id=”imageform” method=”post” enctype=”multipart/form-data” action=’ajaxImageUpload.php’ style=”clear:both”> <h1>Upload your images</h1> <div id=’imageloadstatus’ style=’display:none’><img src=”loader.gif” alt=”Uploading….”/></div> <div id=’imageloadbutton’> <input type=”file” name=”photos[]” id=”photoimg1″…
How to display Prev/Next buttons on a Nivo slider when MouseOver
Most of slider effects will display the Prev/Next buttons by default once you open the page that contain a slider effect. Whether you build a slider for a CMS or a shopping cart or a regular HTML page, you can be able to change the codes in CSS and slider block on your HTML page. Here’s how you do it. Open the CSS file that supports the slider, add a style for the Prev/Next layer. Hide the layer on display first. .parent .navigation-links { display:none;…