|
JavaScript - Error In Javascript; Using On Blogger Platform
With Blogger you have to 'pre-install' the jQuery code into the main coding, which I already did. Installed correctly, per help of other online forums. The problem I'm having now, is the CSS & HTML is coming together beautifully, but the hover effects are not working on the two drop-down options with multiple links. It is supposed to yield this: Ardor | CSS MenuMaker
This is the proposed Javascript, that for some reason is not working. Code: <script type="text/javascript">
(function($){
$(document).ready(function(){
$('#cssmenu').prepend('<div id="menu-button">Menu</div>');
$('#cssmenu #menu-button').on('click', function(){
var menu = $(this).next('ul');
if (menu.hasClass('open')) {
menu.removeClass('open');
} else {
menu.addClass('open');
}); });
})(jQuery); </script>
The HTML portion is: Code: @import url(http://fonts.googleapis.com/css?family=Open+Sans:400,700);
#cssmenu,
#cssmenu ul,
#cssmenu ul li,
#cssmenu ul li a,
#cssmenu #menu-button {
margin: 0;
padding: 0;
border: 0;
list-style: none;
line-height: 1;
display: block;
position: relative;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
#cssmenu:after,
#cssmenu > ul:after {
content: ".";
display: block;
clear: both;
visibility: hidden;
line-height: 0;
height: 0;
}
#cssmenu #menu-button {
display: none;
}
#cssmenu {
z-index: 999;
width: 750px;
font-family: 'Open Sans', Helvetica, sans-serif;
background: #ffffff;
background: -moz-linear-gradient(top, #ffffff 0%, #ebebeb 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #ffffff), color-stop(100%, #ebebeb));
background: -webkit-linear-gradient(top, #ffffff 0%, #ebebeb 100%);
background: -o-linear-gradient(top, #ffffff 0%, #ebebeb 100%);
background: -ms-linear-gradient(top, #ffffff 0%, #ebebeb 100%);
background: linear-gradient(to bottom, #ffffff 0%, #ebebeb 100%);
}
#cssmenu > ul {
background: url('bg.png');
box-shadow: inset 0 -3px 0 rgba(0, 0, 0, 0.05);
}
#cssmenu.align-right > ul > li {
float: right;
}
#cssmenu > ul > li {
float: left;
display: inline-block;
}
#cssmenu.align-center > ul {
float: none;
text-align: center;
font-size: 0;
}
#cssmenu.align-center > ul > li {
float: none;
}
#cssmenu.align-center ul ul {
text-align: left;
}
#cssmenu > ul > li > a {
padding: 18px 25px 21px 25px;
border-right: 1px solid rgba(80, 80, 80, 0.12);
text-decoration: none;
font-size: 10px;
font-weight: 700;
color: #a19393;
text-transform: uppercase;
letter-spacing: 1px;
}
#cssmenu > ul > li:hover > a,
#cssmenu > ul > li > a:hover,
#cssmenu > ul > li.active > a {
color: #ffffff;
background: #f7f7f7;
background: rgba(0, 0, 0, 0.1);
}
#cssmenu > ul > li.has-sub > a {
padding-right: 45px;
}
#cssmenu > ul > li.has-sub > a::after {
content: "";
position: absolute;
width: 0;
height: 0;
border: 6px solid transparent;
border-top-color: #a19393;
right: 17px;
top: 20.5px;
}
#cssmenu > ul > li.has-sub.active > a::after,
#cssmenu > ul > li.has-sub:hover > a {
border-top-color: #ffffff;
}
#cssmenu ul ul {
position: absolute;
left: -9999px;
top: 60px;
z-index: 9999;
padding-top: 6px;
font-size: 10px;
opacity: 0;
-webkit-transition: top 0.2s ease, opacity 0.2s ease-in;
-moz-transition: top 0.2s ease, opacity 0.2s ease-in;
-ms-transition: top 0.2s ease, opacity 0.2s ease-in;
-o-transition: top 0.2s ease, opacity 0.2s ease-in;
transition: top 0.2s ease, opacity 0.2s ease-in;
}
#cssmenu.align-right ul ul {
text-align: right;
}
#cssmenu > ul > li > ul::after {
content: "";
position: absolute;
width: 0;
height: 0;
border: 5px solid transparent;
border-bottom-color: #ffffff;
top: -4px;
left: 20px;
}
#cssmenu.align-right > ul > li > ul::after {
left: auto;
right: 20px;
}
#cssmenu ul ul ul::after {
content: "";
position: absolute;
width: 0;
height: 0;
border: 5px solid transparent;
border-right-color: #ffffff;
top: 11px;
left: -4px;
}
#cssmenu.align-right ul ul ul::after {
border-right-color: transparent;
border-left-color: #ffffff;
left: auto;
right: -4px;
}
#cssmenu > ul > li > ul {
top: 120px;
}
#cssmenu > ul > li:hover > ul {
top: 49px;
left: 0;
opacity: 1;
}
#cssmenu.align-right > ul > li:hover > ul {
left: auto;
right: 0;
}
#cssmenu ul ul ul {
padding-top: 0;
padding-left: 6px;
}
#cssmenu.align-right ul ul ul {
padding-right: 6px;
}
#cssmenu ul ul > li:hover > ul {
left: 140px;
top: 0;
opacity: 1;
}
#cssmenu.align-right ul ul > li:hover > ul {
left: auto;
right: 100%;
opacity: 1;
}
#cssmenu ul ul li a {
text-decoration: none;
font-weight: 400;
padding: 11px 25px;
width: 140px;
color: #a19393;
background: #ffffff;
box-shadow: 0 2px 2px rgba(0, 0, 0, 0.1), 1px 1px 1px rgba(0, 0, 0, 0.1), -1px 1px 1px rgba(0, 0, 0, 0.1);
}
#cssmenu ul ul li:hover > a,
#cssmenu ul ul li.active > a {
color: #ffffff;
}
#cssmenu ul ul li:first-child > a {
border-top-left-radius: 3px;
border-top-right-radius: 3px;
}
#cssmenu ul ul li:last-child > a {
border-bottom-left-radius: 3px;
border-bottom-right-radius: 3px;
}
#cssmenu > ul > li > ul::after {
position: absolute;
display: block;
}
#cssmenu ul ul li.has-sub > a::after {
content: "";
position: absolute;
width: 0;
height: 0;
border: 4px solid transparent;
border-left-color: #a19393;
right: 17px;
top: 14px;
top: 12.5px;
}
#cssmenu.align-right ul ul li.has-sub > a::after {
border-left-color: transparent;
border-right-color: #a19393;
right: auto;
left: 17px;
}
#cssmenu ul ul li.has-sub.active > a::after,
#cssmenu ul ul li.has-sub:hover > a::after {
border-left-color: #ffffff;
}
#cssmenu.align-right ul ul li.has-sub.active > a::after,
#cssmenu.align-right ul ul li.has-sub:hover > a::after {
border-right-color: #ffffff;
border-left-color: transparent;
}
@media all and (max-width: 800px), only screen and (-webkit-min-device-pixel-ratio: 2) and (max-width: 1024px), only screen and (min--moz-device-pixel-ratio: 2) and (max-width: 1024px), only screen and (-o-min-device-pixel-ratio: 2/1) and (max-width: 1024px), only screen and (min-device-pixel-ratio: 2) and (max-width: 1024px), only screen and (min-resolution: 192dpi) and (max-width: 1024px), only screen and (min-resolution: 2dppx) and (max-width: 1024px) {
#cssmenu {
background: #ffffff;
}
#cssmenu > ul {
display: none;
}
#cssmenu > ul.open {
display: block;
border-top: 1px solid rgba(0, 0, 0, 0.1);
}
#cssmenu.align-right > ul {
float: none;
}
#cssmenu.align-center > ul {
text-align: left;
}
#cssmenu > ul > li,
#cssmenu.align-right > ul > li {
float: none;
display: block;
}
#cssmenu > ul > li > a {
padding: 18px 25px 18px 25px;
border-right: 0;
}
#cssmenu > ul > li:hover > a,
#cssmenu > ul > li.active > a {
background: rgba(0, 0, 0, 0.1);
}
#cssmenu #menu-button {
display: block;
text-decoration: none;
font-size: 13px;
font-weight: 700;
color: #a19393;
padding: 18px 25px 18px 25px;
text-transform: uppercase;
letter-spacing: 1px;
background: url('bg.png');
cursor: pointer;
}
#cssmenu ul ul,
#cssmenu ul li:hover > ul,
#cssmenu > ul > li > ul,
#cssmenu ul ul ul,
#cssmenu ul ul li:hover > ul,
#cssmenu.align-right ul ul,
#cssmenu.align-right ul li:hover > ul,
#cssmenu.align-right > ul > li > ul,
#cssmenu.align-right ul ul ul,
#cssmenu.align-right ul ul li:hover > ul {
left: 0;
right: auto;
top: auto;
opacity: 1;
width: 100%;
padding: 0;
position: relative;
text-align: left;
}
#cssmenu ul ul li {
width: 100%;
}
#cssmenu ul ul li a {
width: 100%;
box-shadow: none;
padding-left: 35px;
}
#cssmenu ul ul ul li a {
padding-left: 45px;
}
#cssmenu ul ul li:first-child > a,
#cssmenu ul ul li:last-child > a {
border-radius: 0;
}
#cssmenu #menu-button::after {
display: block;
-webkit-box-sizing: content-box;
-moz-box-sizing: content-box;
box-sizing: content-box;
content: '';
position: absolute;
height: 3px;
width: 22px;
border-top: 2px solid #a19393;
border-bottom: 2px solid #a19393;
right: 25px;
top: 18px;
}
#cssmenu #menu-button::before {
display: block;
content: '';
position: absolute;
height: 3px;
width: 22px;
border-top: 2px solid #a19393;
right: 25px;
top: 28px;
}
#cssmenu > ul > li.has-sub > a::after,
#cssmenu ul ul li.has-sub > a::after {
display: none;
}
}
The CSS portion is: Code: @import url(http://fonts.googleapis.com/css?family=Open+Sans:400,700);
#cssmenu,
#cssmenu ul,
#cssmenu ul li,
#cssmenu ul li a,
#cssmenu #menu-button {
margin: 0;
padding: 0;
border: 0;
list-style: none;
line-height: 1;
display: block;
position: relative;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
#cssmenu:after,
#cssmenu > ul:after {
content: ".";
display: block;
clear: both;
visibility: hidden;
line-height: 0;
height: 0;
}
#cssmenu #menu-button {
display: none;
}
#cssmenu {
z-index: 999;
width: 750px;
font-family: 'Open Sans', Helvetica, sans-serif;
background: #ffffff;
background: -moz-linear-gradient(top, #ffffff 0%, #ebebeb 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #ffffff), color-stop(100%, #ebebeb));
background: -webkit-linear-gradient(top, #ffffff 0%, #ebebeb 100%);
background: -o-linear-gradient(top, #ffffff 0%, #ebebeb 100%);
background: -ms-linear-gradient(top, #ffffff 0%, #ebebeb 100%);
background: linear-gradient(to bottom, #ffffff 0%, #ebebeb 100%);
}
#cssmenu > ul {
background: url('bg.png');
box-shadow: inset 0 -3px 0 rgba(0, 0, 0, 0.05);
}
#cssmenu.align-right > ul > li {
float: right;
}
#cssmenu > ul > li {
float: left;
display: inline-block;
}
#cssmenu.align-center > ul {
float: none;
text-align: center;
font-size: 0;
}
#cssmenu.align-center > ul > li {
float: none;
}
#cssmenu.align-center ul ul {
text-align: left;
}
#cssmenu > ul > li > a {
padding: 18px 25px 21px 25px;
border-right: 1px solid rgba(80, 80, 80, 0.12);
text-decoration: none;
font-size: 10px;
font-weight: 700;
color: #a19393;
text-transform: uppercase;
letter-spacing: 1px;
}
#cssmenu > ul > li:hover > a,
#cssmenu > ul > li > a:hover,
#cssmenu > ul > li.active > a {
color: #ffffff;
background: #f7f7f7;
background: rgba(0, 0, 0, 0.1);
}
#cssmenu > ul > li.has-sub > a {
padding-right: 45px;
}
#cssmenu > ul > li.has-sub > a::after {
content: "";
position: absolute;
width: 0;
height: 0;
border: 6px solid transparent;
border-top-color: #a19393;
right: 17px;
top: 20.5px;
}
#cssmenu > ul > li.has-sub.active > a::after,
#cssmenu > ul > li.has-sub:hover > a {
border-top-color: #ffffff;
}
#cssmenu ul ul {
position: absolute;
left: -9999px;
top: 60px;
z-index: 9999;
padding-top: 6px;
font-size: 10px;
opacity: 0;
-webkit-transition: top 0.2s ease, opacity 0.2s ease-in;
-moz-transition: top 0.2s ease, opacity 0.2s ease-in;
-ms-transition: top 0.2s ease, opacity 0.2s ease-in;
-o-transition: top 0.2s ease, opacity 0.2s ease-in;
transition: top 0.2s ease, opacity 0.2s ease-in;
}
#cssmenu.align-right ul ul {
text-align: right;
}
#cssmenu > ul > li > ul::after {
content: "";
position: absolute;
width: 0;
height: 0;
border: 5px solid transparent;
border-bottom-color: #ffffff;
top: -4px;
left: 20px;
}
#cssmenu.align-right > ul > li > ul::after {
left: auto;
right: 20px;
}
#cssmenu ul ul ul::after {
content: "";
position: absolute;
width: 0;
height: 0;
border: 5px solid transparent;
border-right-color: #ffffff;
top: 11px;
left: -4px;
}
#cssmenu.align-right ul ul ul::after {
border-right-color: transparent;
border-left-color: #ffffff;
left: auto;
right: -4px;
}
#cssmenu > ul > li > ul {
top: 120px;
}
#cssmenu > ul > li:hover > ul {
top: 49px;
left: 0;
opacity: 1;
}
#cssmenu.align-right > ul > li:hover > ul {
left: auto;
right: 0;
}
#cssmenu ul ul ul {
padding-top: 0;
padding-left: 6px;
}
#cssmenu.align-right ul ul ul {
padding-right: 6px;
}
#cssmenu ul ul > li:hover > ul {
left: 140px;
top: 0;
opacity: 1;
}
#cssmenu.align-right ul ul > li:hover > ul {
left: auto;
right: 100%;
opacity: 1;
}
#cssmenu ul ul li a {
text-decoration: none;
font-weight: 400;
padding: 11px 25px;
width: 140px;
color: #a19393;
background: #ffffff;
box-shadow: 0 2px 2px rgba(0, 0, 0, 0.1), 1px 1px 1px rgba(0, 0, 0, 0.1), -1px 1px 1px rgba(0, 0, 0, 0.1);
}
#cssmenu ul ul li:hover > a,
#cssmenu ul ul li.active > a {
color: #ffffff;
}
#cssmenu ul ul li:first-child > a {
border-top-left-radius: 3px;
border-top-right-radius: 3px;
}
#cssmenu ul ul li:last-child > a {
border-bottom-left-radius: 3px;
border-bottom-right-radius: 3px;
}
#cssmenu > ul > li > ul::after {
position: absolute;
display: block;
}
#cssmenu ul ul li.has-sub > a::after {
content: "";
position: absolute;
width: 0;
height: 0;
border: 4px solid transparent;
border-left-color: #a19393;
right: 17px;
top: 14px;
top: 12.5px;
}
#cssmenu.align-right ul ul li.has-sub > a::after {
border-left-color: transparent;
border-right-color: #a19393;
right: auto;
left: 17px;
}
#cssmenu ul ul li.has-sub.active > a::after,
#cssmenu ul ul li.has-sub:hover > a::after {
border-left-color: #ffffff;
}
#cssmenu.align-right ul ul li.has-sub.active > a::after,
#cssmenu.align-right ul ul li.has-sub:hover > a::after {
border-right-color: #ffffff;
border-left-color: transparent;
}
@media all and (max-width: 800px), only screen and (-webkit-min-device-pixel-ratio: 2) and (max-width: 1024px), only screen and (min--moz-device-pixel-ratio: 2) and (max-width: 1024px), only screen and (-o-min-device-pixel-ratio: 2/1) and (max-width: 1024px), only screen and (min-device-pixel-ratio: 2) and (max-width: 1024px), only screen and (min-resolution: 192dpi) and (max-width: 1024px), only screen and (min-resolution: 2dppx) and (max-width: 1024px) {
#cssmenu {
background: #ffffff;
}
#cssmenu > ul {
display: none;
}
#cssmenu > ul.open {
display: block;
border-top: 1px solid rgba(0, 0, 0, 0.1);
}
#cssmenu.align-right > ul {
float: none;
}
#cssmenu.align-center > ul {
text-align: left;
}
#cssmenu > ul > li,
#cssmenu.align-right > ul > li {
float: none;
display: block;
}
#cssmenu > ul > li > a {
padding: 18px 25px 18px 25px;
border-right: 0;
}
#cssmenu > ul > li:hover > a,
#cssmenu > ul > li.active > a {
background: rgba(0, 0, 0, 0.1);
}
#cssmenu #menu-button {
display: block;
text-decoration: none;
font-size: 13px;
font-weight: 700;
color: #a19393;
padding: 18px 25px 18px 25px;
text-transform: uppercase;
letter-spacing: 1px;
background: url('bg.png');
cursor: pointer;
}
#cssmenu ul ul,
#cssmenu ul li:hover > ul,
#cssmenu > ul > li > ul,
#cssmenu ul ul ul,
#cssmenu ul ul li:hover > ul,
#cssmenu.align-right ul ul,
#cssmenu.align-right ul li:hover > ul,
#cssmenu.align-right > ul > li > ul,
#cssmenu.align-right ul ul ul,
#cssmenu.align-right ul ul li:hover > ul {
left: 0;
right: auto;
top: auto;
opacity: 1;
width: 100%;
padding: 0;
position: relative;
text-align: left;
}
#cssmenu ul ul li {
width: 100%;
}
#cssmenu ul ul li a {
width: 100%;
box-shadow: none;
padding-left: 35px;
}
#cssmenu ul ul ul li a {
padding-left: 45px;
}
#cssmenu ul ul li:first-child > a,
#cssmenu ul ul li:last-child > a {
border-radius: 0;
}
#cssmenu #menu-button::after {
display: block;
-webkit-box-sizing: content-box;
-moz-box-sizing: content-box;
box-sizing: content-box;
content: '';
position: absolute;
height: 3px;
width: 22px;
border-top: 2px solid #a19393;
border-bottom: 2px solid #a19393;
right: 25px;
top: 18px;
}
#cssmenu #menu-button::before {
display: block;
content: '';
position: absolute;
height: 3px;
width: 22px;
border-top: 2px solid #a19393;
right: 25px;
top: 28px;
}
#cssmenu > ul > li.has-sub > a::after,
#cssmenu ul ul li.has-sub > a::after {
display: none;
}
}
It generates into a drop-down menu that uses jQuery as part of the effects (simple fade drop-down); any help is greatly appreciated. Java is not my forte Similar TutorialsI wanted to get some people to help test out a game platform: http://ggg.ismywebsite.com/isofield The whole purpose was to push the limits of what can be done with just JavaScript. So no Java/Flash is needed or used. I've tested on Firefox and Internet Explorer. This is just a simple demo game with only one building and a couple resources. There are a few surprises in later levels (not telling), but it's mostly to help test the platform. The final game will have many more buildings and items, and be playable online in an unbounded world. Controls: Space - Switch mode. D - Demolition mode. For demolishing things to make space for farms. H - Harvest mode. For harvesting crops or trees by clicking on them. F - Farm building mode. To build farms. Click to place a farm. M - Move mode. In this mode you can use the left mouse button to drag yourself around the world. Middle Mouse Button - Use this to move around, in any mode. Arrow Keys - Another way to move around. There are 4 levels, plus a bonus one, which you can keep playing as many times as you want. What I'm hoping for: 1) Bugs, glitches, issues, lag, etc... 2) Someone who can help with graphics. 3) If someone knows how to build a good terrain generation algorithm. 4) Ideas for the future of the game. 5) You to enjoy it. Hi, I've a photo gallery with a navigation panel made of little buttons with numbers which, after clicking on them, load the relative photo on the right hand side. This is the page: http://www.newtreedesign.co.uk/test/douglas/_test.html When a number from the navigation panel is clicked, it should turn purple. It all works fine in safari/mac latest versions but there are problems under IE/Win and FireFox/Win, the other 2 environments I'm keen to have compatibility. Could please anyone suggest me what corrections I've to make on the code in order to be sure I've this compatibility issues sorted? Thank you paquito Hi guys. I want to create login form similar like facebook login which web owner can put the script and it will become login for their web and also it will auto register at their web. I believe it need to use javascript because javascript is cross platform. Can someone give me a clue for me to start on? Hello all, this is my first posting and I am happy to have found this forum :-) I have the following question: Is it possible to extract information which is located in a predefined area on the screen from a java platform? For example, there is java based platform which I can see on my screen. This platform contains numbers/letters. The location of these numbers/letters does not change, i.e. the script would not need to be adjusted if the field, which contains the info, would move. Lets assume the screen would look like that: 1234 I 12.20 Love I 1.30 Lake I 32.00 The info between the fields would be clearly separated. Now I would like to extract the infos from all the fields and paste the info for example in EXCEL so that I can see "Valerie12345" in .xls field A1 / 12.20 in A2 / Love in B1 etc... Does anybody of you know if that is possible to extract? Thank you very much in advance, Valerie Hi everyone! I am trying to edit a color on a javascript query for a blogger site. I'm a newbie and looking hard for a solution. Hope it's an easy answer. Thank you in advance. http://newmomcents.blogspot.com/ On the left, there is a gray box that is holding the moving images. I am hoping to change the color to something that would compliment my blog theme. I am complete newbie to this topic and i want to know how to add and external javascript file for blogger. I have heard that it decreases the load time of a page. Again please explain clearly as iam a newbie!! Any help would be appreciated!! Thanks In Advance!! hey guys im having a real problem with finding a script to lock my content for blogger, heres an example of the script Quote: http://www.blackhatcodebreaker.com/prison/index.html i have bought this script but does not work in blogger.com, can someone edit this script for me so it can work on bloger? you have to have the files hosted on your webhost.. I've been looking everywhere with no luck, so maybe someone here can help me. If you end up having to code it for me, I'll give you credit and put you in my blogroll. So it's really easy to find a random post widget that just shows a list of links, but that's not what I want. What I want is something that will show only one post at a time with an image and a text exerpt. I also only want it to show posts with the label "favorite products". If you look at my blog now (http://www.orangeraspberrylemonade.blogspot.com), you'll see that there's a section in the sidebar that shows a favorite product and a link to all the posts with that label, but I have to update it manually and therefore only one post is getting attention at any given time. Hello everyone! I got this: <center><script type="text/javascript"> var imgs1 = new Array("http://img687.imageshack.us/img687/4438/kamslide3.jpg","http://img143.imageshack.us/img143/5968/kamslide2.jpg","http://img696.imageshack.us/img696/7066/kamslide1.jpg"); var alt1 = new Array(); var currentAd1 = 0; var imgCt1 = 3; function cycle1() { if (currentAd1 == imgCt1) { currentAd1 = 0; } var banner1 = document.getElementById('adBanner1'); var link1 = document.getElementById('adLink1'); banner1.src=imgs1[currentAd1] banner1.alt=alt1[currentAd1] currentAd1++; } window.setInterval("cycle1()",7000); </script> <img src="http://img687.imageshack.us/img687/4438/kamslide3.jpg" id="adBanner1" border="0" width="861" height="267" /></center> It looks like this: http://dolollies.blogspot.com How can I make the image fade?? When running my PHP code locally I am recieving the following error: Webpage error details User Agent: Mozilla/4.0 (compatible; MSIE 8.0; Windows NT 6.1; Trident/4.0; BTRS26718; SLCC2; .NET CLR 2.0.50727; .NET CLR 3.5.30729; .NET CLR 3.0.30729; Media Center PC 6.0; .NET4.0C; InfoPath.2; OfficeLiveConnector.1.5; OfficeLivePatch.1.3; Tablet PC 2.0) Timestamp: Thu, 7 Apr 2011 15:47:06 UTC Message: Object doesn't support this property or method Line: 4 Char: 1 Code: 0 URI: http://localhost/MowingSch.php ********************* * Selected Code ********************* Code: // JavaScript
<script type='text/javascript'>
function insCell(p1){
var wi = document.getElementById('Mowing').getElementsByName(p1).getElementsByTagName('td').length;
if (wi == 3) {
var x=document.getElementById(p1).insertCell(3);
x.innerHTML='<?PHP echo $n; ?>';
var x=document.getElementById(p1).insertCell(4);
x.innerHTML='<?PHP echo $p; ?>';
var x=document.getElementById(p1).insertCell(5);
x.innerHTML='<?PHP echo $e; ?>';
} else {
alert('Date selected is already assigned!');
}
}
</script>
Code: // PHP Code
$x = 0;
for ($r = 0; $r <=27; $r++){
$id = 'tr'.$r;
echo "<tr id=$id><TD><input id='SignUp' name=$id type='image' src='mow.png' name='mow' onclick='insCell($id)'></TD>";
for ($c = 0; $c <= 4; $c++) {
if($data[$x + $c] <> ''){
echo "<td>" . $data[$x + $c] . "</td>";
}
}
echo "</tr>";
$x = $x + 5;
}
Would appreciate ANY assistance!
Thanks.
I was working on this script to change text with javascript and I ran into a problem. The code goes like this: PHP Code: <area shape="rect" coords="128,174,256,203" href="#" onClick="document.getElementById('content').innerHTML='<p class=first>Welcome to the first release of my Now every time I use an apostrophe in a word then when I click the link that corresponds to that writing, it doesn't do anything. Here's the link to my website: http://bittipiilo.com/msx/ By default you are on the Home tab. Then when you click either Gallery or Services and try to go back to Home, nothing happens. Can someone help me? I really can't figure this out... Hopefully you guys may have an idea. Basically I have an Ajax chat that stores a cookie. The first thing it does is checks to see if a cookie is set, if it's not it loads a box to where you can type your name (if it is it skips this), then it allows you to chat. The way I have this set up is on the index, I have a command that loads a php file. I pass through the html a variable... Code: ajaxFunction(3); When it gets to ajaxFunction(funct) I have this script; Code: if(funct == 1){
var source="file2.php";
var name = document.getElementById('name').value;
status = 1;
var queryString = "?name=" + name + "&status=" + status;
}
if(funct == 2){
var source="file1.php";
var shout = document.getElementById('shout').value;
var color = document.getElementById('color').value;
var bold = document.getElementById('bold').value;
var queryString = "?shout=" + shout + "&color=" + color + "&bold=" + bold;
}
if(funct == 3){
var source="file2.php";
var name = document.getElementById('dfdf').value;
status = 2;
var queryString = "?name=" + name + "&status=" + status;
}
When the program first loads, it runs command 3 which checks to see if a cookie is set. If it is set, it returns a form Code: ................<INPUT TYPE=\"checkbox\" NAME=\"bold\" ID=\"bold\"> <input type=\"button\" onclick=\"ajaxFunction(2)\" value=\"Shout\"> ajaxFunction 2 then loads the chat box. If the cookie isn't set, it loads ajax function(1) which prompts their user for the name. The prompt for the name and the test for the cookie are in the same php file. I have it to where it gets the "status" and it runs the test in this order. PHP 1. Check to see if the person has a cookie (regardless to status) if true, run file1.php 2. If the person does not have a cookie set but status = 2, returns the prompt for the user to set a name. Code: echo "<form name=\"cookiedata\">
Name: <input type=\"text\" name=\"name\" id=\"name\" onChange=\"ajaxFunction(1)\" onkeypress=\"{if (event.keyCode==13)ajaxFunction(1)}\">
<input type=\"button\" onclick=\"ajaxFunction(1)\" value=\"Save\">
</form>
";
//note, this actually replaces a div on the main page and does the prompt
3. If the person has a name set and is setting a cookie now, status = 1 then run file1.php Now the weird thing is, This thing works entierly on firefox... but for some reason when it loads in ie, i don't get the chat box. I don't get any errors either. For some reason, it doesn't seem to like the variable that is passed through to the php which is done like Code: var command = ""+source+""+queryString+"";
ajaxRequest.open("GET", command, true);
and recieved by php like Code: <?php
include('config.php');
$status=$_GET['status'];
$name = $_GET['name'];
if($status==1){
do some code
}else if($status==2){
do some code
}.....................?>
What is going on? How do I fix this with out splitting up the file in to two files? (before, it went to two seperate files, and it worked great... now they are both in the same file with a condition statement and nothing is working?) I am getting an error with a script and can't seem to figure out the problem. Firebug Error message: Error: document.forms[myform] is undefined Source File: https://www.domain.com/js/remember.js Line: 24 I have attached the HTML page and the remote javascript file. The script instructions said to include an onload action in the <BODY> tag as follows: <body background="/images/gold2.gif" onLoad="loadCookie(); displayFormData('my_form');"> BUT I was trying to use an even loader in the remote js file instead. Any help would be greatly appreciated. I have a script: PHP Code: <script type="text/javascript"> var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www."); document.write(unescape("%3Cscript src="" + gaJsHost + "google-analytics.com/ga.js" type="text/javascript"%3E%3C/script%3E")); </script> <script type="text/javascript"> try { var pageTracker = _gat._getTracker("UA-13289331-1"); pageTracker._trackPageview(); } catch(err) {}</script> But firefox detects here an error which is: error: PHP Code: missing ) after argument list [Break on this error] document.write(unescape("%3Cscript src..."text/javascript"%3E%3C/script%3E"));n How I can fix that, because I didn't see what is wrong with ) symbol. Hey guys, I'm a student taking JavaScript classes, I really like it so far and hope to really understand it in the next couple weeks. I'm doing my homework and just successfully coded a calendar (didn't take me very long, like I said, I'm catching on pretty quick and having fun) Having said that I'm not interested in getting any coding help, I simply like to further understand what I'm doing because I'm taking an online class. I'm going to show you my html and javascript file and I really need to understand why my address footer is in the middle? I have some HTML knowledge and know that since I put the address code at the bottom it should show up at the bottom. I deleted the linked .js file and it suddenly appeared at the bottom, therefore I'm thinking it has something to do with my javascript code. Does javascript act differently? Like I said, I'm not looking for anyone posting any kind of code, I'm just trying to understand what it is doing. Code: <title>Yearly Calendar</title>
<link href="styles.css" rel="stylesheet" type="text/css" />
<link href="yearly.css" rel="stylesheet" type="text/css" />
<script src="yearly.js" type="text/javascript"></script>
</head>
<body>
<div id="head">
<img style="float: right; border: 1px solid orange" src="photo.jpg" alt="" />
<img src="ccc.jpg" alt="Chamberlain Civic Center" />
</div>
<div id="links">
<table><tr>
<td><a href="#">Home</a></td><td><a href="#">Tickets</a></td>
<td><a href="#">Events</a></td><td><a href="#">Directions</a></td>
<td><a href="#">Hours</a></td><td><a href="#">Calendar</a></td>
<td><a href="#">Tour</a></td><td><a href="#">Contact Us</a></td>
</tr></table>
</div>
<div id="main" align="center">
<h1>Yearly Calendar</h1>
<center><script type="text/javascript">
yearly()
</script>
</center>
</div>
<address>
The Chamberlain Civic Center ·
2011 Canyon Drive ·
Chamberlain, SD 57325 ·
(800) 555-8741
</address>
</body>
</html>
Code: function yearly(calDate)
{
if (calDate == null) calendarDay=new Date()
else calendarDay = new Date(calDate);
var currentTime= calendarDay.getTime();
var thisYear= calendarDay.getFullYear();
document.write("<table id='yearly_table'><tr>");
document.write("<th id='yearly_title' colspan='4'>");
document.write(thisYear);
document.write("</th>");
document.write("</tr>");
var monthNum = -1;
for (var i=1; i<=3; i++)
{
document.write("<tr>")
for (var j=1; j<=4; j++)
{
monthNum++;
calendarDay.setDate(1);
calendarDay.setMonth(monthNum);
writeMonthCell(calendarDay, currentTime);
}
}write.document("</tr>");
write.document("</table>")
}
function writeMonthCell(calendarDay, currentTime)
{
document.write("<td class='yearly_months'>");
writeMonth(calendarDay, currentTime);
document.write("</td>");
}
function writeMonth(calendarDay, currentTime) {
document.write("<table class='monthly_table'>");
writeMonthTitle(calendarDay);
writeDayNames()
writeMonthDays(calendarDay, currentTime);
document.write("</table>");
}
function writeMonthTitle(calendarDay) {
var monthName = new Array("January", "February", "March", "April", "May",
"June", "July", "August", "September", "October", "November", "December");
var thisMonth=calendarDay.getMonth();
document.write("<tr>");
document.write("<th class='monthly_title' colspan='7'>");
document.write(monthName[thisMonth]);
document.write("</th>");
document.write("</tr>");
}
function writeDayNames() {
var dayName = new Array("Sun","Mon","Tue","Wed","Thu","Fri","Sat");
document.write("<tr>");
for (var i=0;i<dayName.length;i++) {
document.write("<th class='monthly_weekdays'>"+dayName[i]+"</th>");
}
document.write("</tr>");
}
function daysInMonth(calendarDay) {
var thisYear = calendarDay.getFullYear();
var thisMonth = calendarDay.getMonth();
var dayCount = new Array(31,28,31,30,31,30,31,31,30,31,30,31);
if ((thisYear % 4 == 0)&&((thisYear % 100 !=0) || (thisYear % 400 == 0))) {
dayCount[1] = 29;
}
return dayCount[thisMonth];
}
function writeMonthDays(calendarDay, currentTime) {
var weekDay = calendarDay.getDay();
document.write("<tr>");
for (var i=0; i < weekDay; i++) {
document.write("<td></td>");
}
var totalDays = daysInMonth(calendarDay);
for (var dayCount=1; dayCount<=totalDays; dayCount++) {
calendarDay.setDate(dayCount);
weekDay = calendarDay.getDay();
writeDay(weekDay, dayCount, calendarDay, currentTime);
}
document.write("</tr>");
}
function writeDay(weekDay, dayCount, calendarDay, currentTime) {
if (weekDay == 0) document.write("<tr>");
if (calendarDay.getTime() == currentTime) {
document.write("<td class='monthly_dates' id='today'>"+dayCount+"</td>");
} else {
document.write("<td class='monthly_dates'>"+dayCount+"</td>");
}
if (weekDay == 6) document.write("</tr>");
}
Hy guys i have this error uncaught exception: [Exception... "Could not convert JavaScript argument" nsresult: "0x80570009 (NS_ERROR_XPC_BAD_CONVERT_JS)" location: "JS frame :: http://www.tgi.com.pt/merdo/scroll/ :: anonymous :: line 435" data: no] the problem is this code Code: <script type="text/javascript">
var gal = {
init : function() {
if (!document.getElementById || !document.createElement || !document.appendChild) return false;
if (document.getElementById('gallery')) document.getElementById('gallery').id = 'jgal';
var li = document.getElementById('jgal').getElementsByTagNa me('li');
li[0].className = 'active';
for (i=0; i<li.length; i++) {
li[i].style.backgroundImage = 'url(' + li[i].getElementsByTagName('img')[0].src + ')';
li[i].style.backgroundRepeat = 'no-repeat';
li[i].title = li[i].getElementsByTagName('img')[0].alt;
gal.addEvent(li[i],function() {
var im = document.getElementById('jgal').getElementsByTagNa me('li');
for (j=0; j<im.length; j++) {
im[j].className = '';
}
this.className = 'active';
});
}
},
addEvent : function(obj, type, fn) {
if (obj.addEventListener) {
obj.addEventListener(type, fn, false);
}
else if (obj.attachEvent) {
obj["e"+type+fn] = fn;
obj[type+fn] = function() { obj["e"+type+fn]( window.event ); }
obj.attachEvent("on"+type, obj[type+fn]);
}
}
}
gal.addEvent(window,'load', function() {
gal.init();
});
</script>
I thin this is a conflict between fancybox plug in and the script above http://www.tgi.com.pt/merdo/scroll/ I really need help... Thanks http://www.cricketcoachingclinics.com.au/ I am having a problem with site in IE7 this is identified as a problem?? Can someone at least rule out this js error? This is js generated when adding google maps Error Class is not defined <CODE>var GoogleMap=Class.create(Widget,{widgetIdentifier:"com-apple-iweb-widget-GoogleMap",initialize:function($super,instanceID,widgetPath,sharedPath,sitePath,preferences,runningI nApp) {if(instanceID){$super(instanceID,widgetPath,sharedPath,sitePath,preferences,runningInApp);}},mapReq uestTemplate:'center=#{center}&zoomLevel=#{zoomLevel}&showZoom=#{showZoom}&mapType=#{mapType}&locate dAddress=#{locatedAddress}&locatedAddressPoint=#{locatedAddressPoint}&showInfo=#{showInfo}&language= #{language}&showGoogleBar=#{showGoogleBar}',iframeTemplate:'<iframe id="#{instanceID}-iframe" name="#{instanceID}-iframe" src="#{mapURL}?#{mapRequest}" width="100%" height="100%" scrolling="no" marginheight="0" marginwidth="0" frameborder="0"></iframe>',mapURL:'http://www.me.com/st/1/sharedassets/maps/iweb2/',onload:function() {var mapRequestTemplate=new Template(this.mapRequestTemplate);var mapRequest=mapRequestTemplate.evaluate({center:this.escapedPreferenceForKey("center"),zoomLevel:this .escapedPreferenceForKey("zoomLevel"),showZoom:this.escapedPreferenceForKey("showZoom"),mapType:this .escapedPreferenceForKey("mapType"),locatedAddress:this.escapedPreferenceForKey("locatedAddress"),lo catedAddressPoint:this.escapedPreferenceForKey("locatedAddressPoint"),showInfo:this.escapedPreferenc eForKey("showInfo"),language:this.escapedPreferenceForKey("language"),showGoogleBar:this.escapedPref erenceForKey("showGoogleBar")});var iframeTemplate=new Template(this.iframeTemplate);var iframeText=iframeTemplate.evaluate({instanceID:this.instanceID,mapRequest:mapRequest,mapURL:this.map URL});this.div().innerHTML=iframeText;if(this.preferences&&this.preferences.postNotification) this.preferences.postNotification("BLWidgetIsSafeToDrawNotification",1);},escapedPreferenceForKey:fu nction(key) {var value=this.preferenceForKey(key);if(value!==undefined) value=encodeURIComponent(value);return value;}});</CODE> Sup gents. Im trying to wrap some html code inside javascript. Problem is i want the picture here to link me to another page, im inserting the link command inside the picture tag put still the link isnt happening. Ive written in a wrong way? Code: document.writeln('<div id="Apartments"><table width="512" height="723" bgcolor="#666633">\n\n <tr>\n <th width="269" height="246" scope="col"><table width="243" height="208" border="1">\n <tr>\n <th height="23" colspan="2" scope="col">Apartment Fola<\/th>\n <\/tr>\n <tr>\n\n <td height="23" colspan="2"><img src="Images\/tn_G1-pokoj.jpg" alt="Fola" width="235" height="139" <a href="apartmentfola.html">/a> <\/>
Just want to be sure - I am trying to install cufon scripts and apparently we should "Add JavaScript error handling in case there is an error loading" Is this done like the following: Code: <script type="text/javascript">
function handleError() { return true; }
window.onerror = handleError;
</script>
Thanks My website has 11 drop down lists containing different data fields. getvalues(), getvalues_1(),...getvalues_10() are user defined functions which store the value of the data field selected by the user from the drop down list. And then using Switch case statement I assign a particular value to a variable depending on what value the user selected from the drop down list. When I checked the code using 'Firebug' error console, I got two different kinds of syntactical errors, such as: 1. Error: syntax error Line: 484, Column: 36 Source Code: var groom_age = function getvalues(); <- The first kind of error points towards the semicolon And the error was present for all the 11 drop down lists (all pointing towards the semicolon) Now, when I removed the semicolon while calling the function get_values(), I got a second type of syntax error: 2. syntax error: switch (groom_age) . Error for all switch case statements The deceleration of the function getvalues() is as follows: Code: <script type = "text/javascript">
function getvalues() {
var val = document.Age.Groomage.value;
var si = document.Age.Groomage.selectedIndex;
if (si != 0) {
var textval = document.Age.Groomage.options[si].text;
return textval;
}
}
</script>
The JavaScript code for the Switch Case statement is as follows: Code: <script type="text/javascript">
var age;
var groom_age = function getvalues()
switch(groom_age)
{
case '23': age = 1.6;
break;
case '24': age = 1.8;
break;
case '25': age = 1.7;
break;
case '26': age = 1.8;
break;
case '27': age = 1.9;
break;
case '28': age = 1.75;
break;
case '29': age = 1.7;
break;
case '30': age = 1.4;
break;
case '31-35': age = 1.8;
break;
case '36-40': age = 1.9;
break;
case '41-45': age = 1.75;
break;
case '46-50': age = 1.7;
break;
case '51+': age = 1.4;
break;
default: alert ('Please select an option');
}
</script>
<script type="text/javascript">
var caste;
var groom_caste = function getvalues_1()
switch(groom_caste)
{
case 'Brahmin' : caste = 2.0;
break;
case 'Bania': caste = 1.8;
break;
case 'Kayastha' : caste = 1.6;
break;
case 'Kshatriya' : caste = 2.0;
break;
case 'Dalit': caste = 1.8;
break;
case 'Maravar' : caste = 1.6;
break;
case 'Mudaliar' : caste = 2.0;
break;
case 'Jat': caste = 1.8;
break;
case 'Labanas' : caste = 1.6;
break;
case 'Rajput' : caste = 1.6;
break;
default : alert ('Please select an option');
}
</script>
.
.
.
.
Other Switch Case Statements
.
.
<script type="text/javascript">
var father;
var groom_father = function getvalues_10();
switch(groom_father)
{
case 'Doctor': father= 1.8;
break;
case 'IAS': father = 2.0;
break;
case 'Engineer': father= 1.7;
break;
case 'Lawyer': father= 1.65;
break;
case 'CA': father= 1.8;
break;
case 'Engineer + MBA': father= 1.9;
break;
case 'Family Business': father= 1.2;
break;
default : alert ('Please select an option');
}
</script>
Can someone please point out to me the mistake in the code? I would be really grateful. Thanks a lot! |
|||||||