Today we learn how to change different background colors of different divs in the template using php javascript.
Code explanation :- i am using jscolor color picker to select color . /
<script type="text/javascript" src="jscolor/jscolor.js"></script> <input class="color" id="textbox1" name="textbox1"/>
To change the background color of div. div id is important for example :-
<script type="text/javascript" src="jscolor/jscolor.js"></script>
<form name="form1" id="form1"><div id="div1" style="width:400px; height:50px;"></div> <input class="color" id="textbox1" name="textbox1" onchange="backColor(this.form1.textbox1.value)"//></form>
<script type="text/javascript">
function backColor(color){
color = '#' + color ;
var myDiv = document.getElementById("div1");
myDiv.style.backgroundColor = color;
}
</script>
<script type="text/javascript" src="jscolor/jscolor.js"></script>
<script type="text/javascript">
function backColor(color,ids){
color = '#' + color ;
var myDiv = document.getElementById(ids);
myDiv.style.backgroundColor = color;
//alert(ids);
}</script><html><form name="form" id="form" method="post">Nav :-<input class="color" id="navbarColor" name="navbarColor" onchange="backColor(this.form.navbarColor.value ,'navbar')" value="<?php echo $navbarColor;?>"/><br/>
<div class="navbar" id="navbar"></div>
</html>
In above code input field has id that is navbarColor and have a onchange event function backColor() and has two parameters one get input field value and other contain id div which we want to change color.
In backColor function has two variable name color and ids .
To change font
function tfontFamily(font){var myDiv = document.getElementById("bground");
myDiv.style.fontFamily = font;
myDiv.style.color = '#fff';
}
How to store data in database filed .
-- Table structure for table `settings` -- CREATE TABLE IF NOT EXISTS `settings` ( `id` int(10) NOT NULL AUTO_INCREMENT, `contColor` varchar(10) COLLATE latin1_general_ci NOT NULL, `topColor` varchar(10) COLLATE latin1_general_ci NOT NULL, `navbarColor` varchar(10) COLLATE latin1_general_ci NOT NULL, `mainColor` varchar(10) COLLATE latin1_general_ci NOT NULL, `postColor` varchar(10) COLLATE latin1_general_ci NOT NULL, `postRightColor` varchar(10) COLLATE latin1_general_ci NOT NULL, `postRightAds` varchar(10) COLLATE latin1_general_ci NOT NULL, `pageColor` varchar(10) COLLATE latin1_general_ci NOT NULL, `footerColor` varchar(10) COLLATE latin1_general_ci NOT NULL, PRIMARY KEY (`id`) ) ENGINE=MyISAM DEFAULT CHARSET=latin1 COLLATE=latin1_general_ci AUTO_INCREMENT=4 ; --
To save all the field data in the mysql database it is important to know insert query.
Please download code files to learn how code work..
Please leave your valuable comments .
Thank you .
No comments:
Post a Comment