I'm really new to Programming with Jquery Mobile and can't figure out how to change the background to black... I've done it before but for some reason I can't get it to change...
Here is what I'm working on... When you click on the Male or Female Button a male or female image appears, I want the background behind the image and the buttons to be black...
Also, is there a way to have the male image show before clicking a button?
Thanks for the Help you guys are awesome!
Here is the Code:
<!DOCTYPE html>
<html>
<head>
<title>jQuery Mobile Web App</title>
<link href="
http://code.jquery.com/mobile/1.3.0/jquery.mobile-1.3.0.min.css" rel="stylesheet" type="text/css"/>
<script src="
http://code.jquery.com/jquery-1.8.3.min.js" type="text/javascript"></script>
<script src="
http://code.jquery.com/mobile/1.3.0/jquery.mobile-1.3.0.min.js" type="text/javascript"></script>
<div data-role="page" id="page">
<div data-role="header" data-theme="b">
<h1>VMT</h1>
</div>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title></title>
</script><script>
$(function(){
$('#image').hide();
$('#male').click(function(){
$("#male").attr('checked', true);
$("#female").attr('checked', false);
$('#image' ).html('<img src="MaleHF.jpg">');
$('#image').show();
});
$('#female').click(function(){
$("#female").attr('checked', true);
$("#male").attr('checked', false);
$('#image' ).html('<img src="FemaleHF.jpg">');
$('#image').show();
});
});
</script>
<div data-role="fieldcontain">
<fieldset data-role="controlgroup" data-type="horizontal">
<form>
<div id="image"></div>
</form>
<label>
<input name="male" type="radio" id="male" value="male" data-theme="b">
Male</label>
<label>
<input name="female" type="radio" id="female" value="female" data-theme="b">
Female</label>
</body>
</html>