SitePoint Sponsor

User Tag List

Results 1 to 3 of 3
  1. #1
    SitePoint Zealot
    Join Date
    Mar 2007
    Posts
    191
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Thumbs up I have learned much from you all

    http://rentev.com/leoj/Momotaro/dragdrop/index2.html

    Lots and lots of hours toiling in Javascript codes. Only works well in IE.

    Enjoy! make sure to press all the buttons (esp. print story) because they all do something cool.

    I HIGHLY suggest you read the help popup. Just click the help link at the top left of the page.

    Thanks for all your support.

    ______________________________________________________________________________________

    So anyways, for the real question here: Why is it not cross-browser? Is there anything obvious? Like simple logical thoughts that a beginner wouln't have, but you think before even looking at any code?

    Well, I no one will want to (at all) but feel free to look through my long and sloppy code.
    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN">
    
    <html>
    
    <head>
    
    <SCRIPT LANGUAGE="JavaScript">
    <!--
    
    /*
       name - name of the cookie
       value - value of the cookie
       [expires] - expiration date of the cookie
         (defaults to end of current session)
       [path] - path for which the cookie is valid
         (defaults to path of calling document)
       [domain] - domain for which the cookie is valid
         (defaults to domain of calling document)
       [secure] - Boolean value indicating if the cookie transmission requires
         a secure transmission
       * an argument defaults when it is assigned null as a placeholder
       * a null placeholder is not required for trailing omitted arguments
    */
    
    function setCookie(name, value, expires, path, domain, secure) {
      var curCookie = name + "=" + escape(value) +
          ((expires) ? "; expires=" + expires.toGMTString() : "") +
          ((path) ? "; path=" + path : "") +
          ((domain) ? "; domain=" + domain : "") +
          ((secure) ? "; secure" : "");
      document.cookie = curCookie;
    }
    
    
    /*
      name - name of the desired cookie
      return string containing value of specified cookie or null
      if cookie does not exist
    */
    
    function getCookie(name) {
      var dc = document.cookie;
      var prefix = name + "=";
      var begin = dc.indexOf("; " + prefix);
      if (begin == -1) {
        begin = dc.indexOf(prefix);
        if (begin != 0) return null;
      } else
        begin += 2;
      var end = document.cookie.indexOf(";", begin);
      if (end == -1)
        end = dc.length;
      return unescape(dc.substring(begin + prefix.length, end));
    }
    
    
    /*
       name - name of the cookie
       [path] - path of the cookie (must be same as path used to create cookie)
       [domain] - domain of the cookie (must be same as domain used to
         create cookie)
       path and domain default if assigned null or omitted if no explicit
         argument proceeds
    */
    
    function deleteCookie(name, path, domain) {
      if (getCookie(name)) {
        document.cookie = name + "=" +
        ((path) ? "; path=" + path : "") +
        ((domain) ? "; domain=" + domain : "") +
        "; expires=Thu, 01-Jan-70 00:00:01 GMT";
      }
    }
    
    // date - any instance of the Date object
    // * hand all instances of the Date object to this function for "repairs"
    
    function fixDate(date) {
      var base = new Date(0);
      var skew = base.getTime();
      if (skew > 0)
        date.setTime(date.getTime() - skew);
    }
    
    // -->
    </SCRIPT>
    
    <script type="text/javascript">
    function enterKey1(evt){
    var k=evt.keyCode? evt.keyCode : evt.charCode
    if (k == 13) {
    stopEdit1();
    } 
    else {
    return k!=13;
    }
    }
    </script>
    <script type="text/javascript">
    function enterKey2(evt){
    var k=evt.keyCode? evt.keyCode : evt.charCode
    if (k == 13) {
    stopEdit2();
    } 
    else {
    return k!=13;
    }
    }
    </script>
    <script type="text/javascript">
    function enterKey3(evt){
    var k=evt.keyCode? evt.keyCode : evt.charCode
    if (k == 13) {
    stopEdit3();
    } 
    else {
    return k!=13;
    }
    }
    </script>
    
    <script>
    function editItem1() {
    	document.getElementById("item1").innerHTML = "<input type='text' style='width:95&#37;; 1visibility: hidden;' id='input1' value='none' ondblClick='stopEdit1(); ' onkeypress='return enterKey1(event)'>";
    }
    function editItem2() {
    	document.getElementById("item2").innerHTML = "<input type='text' style='width:95%; 1visibility: hidden;' id='input2' value='none' ondblClick='stopEdit2()' onkeypress='return enterKey2(event)'>";
    }
    function editItem3() {
    	document.getElementById("item3").innerHTML = "<input type='text' style='width:95%; 1visibility: hidden;' id='input3' value='Made By: ' ondblClick='stopEdit3()' onkeypress='return enterKey3
    
    (event)'>";
    }
    
    function stopEdit1() {
    	document.getElementById("item1").innerHTML = document.getElementById("input1").value;
    }
    function stopEdit2() {
    	document.getElementById("item2").innerHTML = document.getElementById("input2").value;
    }
    function stopEdit3() {
    	document.getElementById("item3").innerHTML = document.getElementById("input3").value;
    }
    </script>
    
    <!--
    <script>
    function newList1() {
    	document.getElementById("phonetic").innerHTML = "<center><a href='javascript:hidediv()' style='color:red; text-decoration:none; font-size:11px;'>[Hide List 1]</a></center><li  >昔(むかし)</li><li  
    
    ></li><li  >ある</li><li  >所(ところ)</li><li  >に</li><li  >、</li><li  >おじいさん</li><li  >と</li><li  >おばあさん</li><li  >が</li><li  >住(す)んで</li>"
    }
    </script>
    -->
    
    <script language=javascript type='text/javascript'>
    function hidediv() {
    if (document.getElementById) { // DOM3 = IE5, NS6
    document.getElementById('hideShow').style.visibility = 'hidden';
    }
    else {
    if (document.layers) { // Netscape 4
    document.hideShow.visibility = 'hidden';
    }
    else { // IE 4
    document.all.hideShow.style.visibility = 'hidden';
    }
    }
    }
    
    function showdiv() {
    if (document.getElementById) { // DOM3 = IE5, NS6
    document.getElementById('hideShow').style.visibility = 'visible';
    }
    else {
    if (document.layers) { // Netscape 4
    document.hideShow.visibility = 'visible';
    }
    else { // IE 4
    document.all.hideShow.style.visibility = 'visible';
    }
    }
    }
    </script> 
    
    
    <script language=javascript type='text/javascript'>
    function hidediv2() {
    if (document.getElementById) { // DOM3 = IE5, NS6
    document.getElementById('hideShow2').style.visibility = 'hidden';
    }
    else {
    if (document.layers) { // Netscape 4
    document.hideShow2.visibility = 'hidden';
    }
    else { // IE 4
    document.all.hideShow2.style.visibility = 'hidden';
    }
    }
    }
    
    function showdiv2() {
    if (document.getElementById) { // DOM3 = IE5, NS6
    document.getElementById('hideShow2').style.visibility = 'visible';
    }
    else {
    if (document.layers) { // Netscape 4
    document.hideShow2.visibility = 'visible';
    }
    else { // IE 4
    document.all.hideShow2.style.visibility = 'visible';
    }
    }
    }
    </script> 
    
    
    <script language=javascript type='text/javascript'>
    function hidediv3() {
    if (document.getElementById) { // DOM3 = IE5, NS6
    document.getElementById('hideShow3').style.visibility = 'hidden';
    }
    else {
    if (document.layers) { // Netscape 4
    document.hideShow3.visibility = 'hidden';
    }
    else { // IE 4
    document.all.hideShow3.style.visibility = 'hidden';
    }
    }
    }
    
    function showdiv3() {
    if (document.getElementById) { // DOM3 = IE5, NS6
    document.getElementById('hideShow3').style.visibility = 'visible';
    }
    else {
    if (document.layers) { // Netscape 4
    document.hideShow3.visibility = 'visible';
    }
    else { // IE 4
    document.all.hideShow3.style.visibility = 'visible';
    }
    }
    }
    </script> 
    
    
    <script>
    function showNumeric2() {
    	var startBox2 = document.getElementById("numeric2");
    	var startBox3 = document.getElementById("numeric3");
    	var startBox4 = document.getElementById("numeric4");
    	var startBox5 = document.getElementById("numeric5");
    	var newItems2 = startBox2.getElementsByTagName("LI");
    	var newItems3 = startBox3.getElementsByTagName("LI");
    	var newItems4 = startBox4.getElementsByTagName("LI");
    	var newItems5 = startBox5.getElementsByTagName("LI");
    	var s2 = "[Start:] ";
    	for (var i = 0; i < newItems2.length; i++) {
    		var s2 = s2 + " " + newItems2[i].innerHTML;
    	}
    	var s3 = " [1:] ";
    	for (var j = 0; j < newItems3.length; j++) {
    		var s3 = s3 + " " + newItems3[j].innerHTML;
    	}
    	var s4 = " [2:] ";
    	for (var k = 0; k < newItems4.length; k++) {
    		var s4 = s4 + " " + newItems4[k].innerHTML;
    	}
    	var s5 = " [End:] ";
    	for (var l = 0; l < newItems5.length; l++) {
    		var s5 = s5 + " " + newItems5[l].innerHTML;
    	}
    	document.getElementById("div2").value = s2 + s3 + s4 + s5;
    }
    </script>
    
    <title>Particle/Word Drag &amp; Drop</title>
    
    
    <style type="text/css">
    #phonetic {
    	position: absolute;
    	left: 0px;
    	top: 40px;
    	height: px;
    }
    
    #phonetic2 {
    	position: absolute;
    	left: 120px;
    	top: 40px;
    	height: px;
    }
    
    
    #phonetic3 {
    	position: absolute;
    	left: 240px;
    	top: 40px;
    	height: px;
    }
    
    /*
    #numeric {
    	position: absolute;
    	right: 0px;
    	top: 0px;
    	border: 1px solid white;
    	height: 542px;
    }
    */
    #numeric2 {
    	position: absolute;
    	right: 0px;
    	top: 0px;
    	border: 1px dashed #AAA;
    	height: 700px;
    	width: 132px
    }
    
    #numeric3 {
    	position: absolute;
    	right: 144px;
    	top: 0px;
    	border: 1px dashed #AAA;
    	height: 700px;
    	width: 132px
    }
    
    #numeric4 {
    	position: absolute;
    	right: 288px;
    	top: 0px;
    	border: 1px dashed #AAA;
    	height: 700px;
    	width: 132px
    }
    
    #numeric5 {
    	position: absolute;
    	right: 432px;
    	top: 0px;
    	border: 1px dashed #AAA;
    	height: 700px;
    	width: 132px
    }
    
    #numeric6 {
    	position: absolute;
    	right: 576px;
    	top: 0px;
    	border: 1px dashed #AAA;
    	height: 700px;
    	width: 132px;
    }
    
    </style>
    
    
    <link rel="stylesheet" href="lists.css" type="text/css"/>
    
    <script language="JavaScript" type="text/javascript" src="coordinates.js"></script>
    
    <script language="JavaScript" type="text/javascript" src="drag.js"></script>
    
    <script language="JavaScript" type="text/javascript" src="dragdrop.js"></script>
    
    <script language="JavaScript" type="text/javascript">
    <!--
    	window.onload = function() {
    
    		var list = document.getElementById("phonetic");
    
    		DragDrop.makeListContainer( list );
    
    		list.onDragOver = function() { this.style["background"] = "#EEF"; };
    
    		list.onDragOut = function() {this.style["background"] = "none"; };
    		
    		
    		var list = document.getElementById("phonetic2");
    
    		DragDrop.makeListContainer( list );
    
    		list.onDragOver = function() { this.style["background"] = "#EEF"; };
    
    		list.onDragOut = function() {this.style["background"] = "none"; };
    
    		
    		var list = document.getElementById("phonetic3");
    
    		DragDrop.makeListContainer( list );
    
    		list.onDragOver = function() { this.style["background"] = "#EEF"; };
    
    		list.onDragOut = function() {this.style["background"] = "none"; };
    
    		/*
    		list = document.getElementById("numeric");
    
    		DragDrop.makeListContainer( list );
    
    		list.onDragOver = function() { this.style["border"] = "1px dashed #AAA"; };
    
    		list.onDragOut = function() {this.style["border"] = "1px solid white"; };
    		*/
    		
    		list = document.getElementById("numeric2");
    
    		DragDrop.makeListContainer( list );
    
    		list.onDragOver = function() { this.style["background"] = "red"; };
    
    		list.onDragOut = function() {this.style["background"] = "none"; };
    
    		
    		list = document.getElementById("numeric3");
    
    		DragDrop.makeListContainer( list );
    
    		list.onDragOver = function() { this.style["background"] = "red"; };
    
    		list.onDragOut = function() {this.style["background"] = "none"; };
    				
    		
    		list = document.getElementById("numeric4");
    
    		DragDrop.makeListContainer( list );
    
    		list.onDragOver = function() { this.style["background"] = "red"; };
    
    		list.onDragOut = function() {this.style["background"] = "none"; };
    				
    		
    		list = document.getElementById("numeric5");
    
    		DragDrop.makeListContainer( list );
    
    		list.onDragOver = function() { this.style["background"] = "red"; };
    
    		list.onDragOut = function() {this.style["background"] = "none"; };
    				
    		
    		list = document.getElementById("numeric6");
    
    		DragDrop.makeListContainer( list );
    
    		list.onDragOver = function() { this.style["background"] = "red"; };
    
    		list.onDragOut = function() {this.style["background"] = "none"; };
    	};
    	//-->
    
    </script>
    
    <style type="text/css">
    body
    { 
    background-image: url('momotaroback.jpg');
    background-repeat: no-repeat;
    background-position: right -100%;
    }
    </style>
    
    </head>
    
    
    <body background="">
    
    <div style="position:absolute; left:34px; top:0px; color: gray; font-size:16px;">
    There are
    <script>showme='y'; st='js'</script>
    <script language="JavaScript" type="text/javascript" src="http://rentev.com/leoj/ezwebstat.js"></script> stories total.
    <noscript><img alt="Number of Students" src="http://www.ezwebstat.com/showhits.php?id=Leoj&st=js"></noscript>
    
    <script language="JavaScript" type="text/javascript" src="http://www.ezwebstat.com/showhits.php?id=Leoj&st=js&type=onlineusr"></script> in progress.
    </div>
    <p>
    
    <!-- <a href="#" onClick="newList1();">TESTME</a> -->
    
    <div style="position:absolute; left:0px; top:0px; color:red; text-decoration:none; font-size:11px">
    <img src="http://photos1.blogger.com/img/43/1633/320/13539955_925e6683c8.jpg" onClick="window.open('http://babelfish.altavista.com/babelfish/trurl_pagecontent?lp=ja_en&url=http%3A%2F%
    
    2Frentev.com%2Fleoj%2FMomotaro%2Fdragdrop%2Findex2.html');" height="20" type="image" width="30" alt="translate" title="translate" style="cursor: pointer;">
    <br><center>
    <a href="javascript: alert('Tip 1: Double click a list item at the end of a left-side list to edit it. Double click it again, or press Enter on your keyboard, when you are done. You may edit the same list item a second 
    
    time after moving it.\r\n\r\nTip 2: You may drag items from the three left-side lists to any of the four lists on the right.\r\n\r\nTip 3: Japanese is traditionally read from the top right (labeled start) and down. Once 
    
    the end has been reached, the reader starts from the beginning of the next line (labeled #1, #2, and End).\r\n\r\nTip 4: The Japanese flag above the Help button translates this page.\r\n\r\nTip 5: Clicking the Show 
    
    Story button (located below the right-side lists) will diplay your story in the text box below.\r\n\r\nTip 6: To update the text box\'s content after moving a list item to the right-side lists, simply press Show Story 
    
    again. This also updates the content after reorganizing list items already in the right-side list.\r\n\r\nTip 7: When you have finished organizing your story, press Show Story.\r\n\r\nTip 8: After clicking the Show 
    
    Story button, you may print your story by clicking the Print Story button which is located to the left of the Show Story button.')" style="color: red; text-decoration: underline; font-size: 11px">Help</a>
    </center>
    </div>
    
    <!-- <iframe src="music.html" height="" width="350" frameborder="0" scrolling="no" style=" position:absolute; padding:0; margin:0; margin-top:0; top:0; left:10;"></iframe> -->
    
    <div style="position:absolute; left: 97px; color:red; text-decoration:none; border:1px;"><a href="javascript:showdiv()" style="color:red; text-decoration:none; font-size:11px;">[Show List 1]</a> <a 
    
    href="javascript:showdiv2()" style="color:red; text-decoration:none; font-size:11px;">[Show List 2]</a> <a href="javascript:showdiv3()" style="color:red; text-decoration:none; font-size:11px;">[Show List 3]
    
    </a></div>
    
    <div id="hideShow">
    <ul id="phonetic" class="sortable boxy" style="margin-left: 1em;">
    <center><a href="javascript: hidediv()" style="color:red; text-decoration:none; font-size:11px;">[Hide List 1]</a></center>
    
    <li >昔(むかし)</li>
    <li >昔</li>
    <li  >ある</li>
    <li  >所(ところ)</li>
    <li  >に</li>
    <li  >、</li>
    <li  >おじいさん</li>
    <li  >と</li>
    <li  >おばあさん</li>
    <li  >が</li>
    <li  >住(す)んで</li>
    <li  >いました</li>
    <li  >。</li>
    <li  >毎日(まいにち)</li>
    <li  >、</li>
    <li  >おじいさん</li>
    <li  >は</li>
    <li  > 山(やま)</li>
    <li  >へ</li>
    <li  >しばかり</li>
    <li  >に</li>
    <li  >、</li>
    <li  >おばあさん</li>
    <li  >は</li>
    <li  >川(かわ)</li>
    <li  >へ</li>
    <li  >洗濯(せんたく)</li>
    <li  > に</li>
    <li  >行(い)き</li>
    <li  >ます</li>
    <li  >。</li>
    <li  >ある日(ひ)</li>
    <li  >の</li>
    <li  >こと</li>
    <li  >、</li>
    <li  >おばあさん</li>
    <li  >が</li>
    <li  >いつも</li>
    <li  >の</li>
    <li  >よう</li>
    <li  > に</li>
    <li  >、</li>
    <li  >川で</li>
    <li  >洗濯</li>
    <li  >を</li>
    <li  >している</li>
    <li  >と</li>
    <li  >、</li>
    <li id="item1" ondblClick="editItem1();" >none</li>
    </ul>
    </div>
    
    <div id="hideShow2">
    <ul id="phonetic2" class="sortable boxy" style="margin-left: 1em;">
    <center><a href="javascript: hidediv2()" style="color:red; text-decoration:none; font-size:11px;">[Hide List 2]</a></center>
    
    <li  >川上(かわかみ)</li>
    <li  >の</li>
    <li  >方(ほう)</li>
    <li  >から</li>
    <li  >なに</li>
    <li  >やら</li>
    <li  >流(なが)れて</li>
    <li  >来(き)ます</li>
    <li  >。</li>
    <li  >ドンブラコッコ</li>
    <li  >、</li>
    <li  >ドンブラコ</li>
    <li  >。</li>
    <li  >よく</li>
    <li  >見(み)ると</li>
    <li  >、</li>
    <li  >とても</li>
    <li  >大(おお)き</li>
    <li  >な</li>
    <li  >桃(もも)</li>
    <li  >で</li>
    <li  >ありません</li>
    <li  >か</li>
    <li  >。</li>
    <li  >「</li>
    <li  >ありゃ  まあ</li>
    <li  >、</li>
    <li  >大き</li>
    <li  >な</li>
    <li  >桃</li>
    <li  >だろう</li>
    <li  >!</li>
    <li  >今(いま)</li>
    <li  >まで</li>
    <li  >に</li>
    <li  >、</li>
    <li  >こん</li>
    <li  >な</li>
    <li  >桃</li>
    <li  >は</li>
    <li  >見たこと</li>
    <li  >が</li>
    <li  >ない</li>
    <li  >」</li>
    <li  >。</li>
    <li  >おどろいたこと</li>
    <li  >に</li>
    <li  >、</li>
    <li id="item2" ondblClick="editItem2();">Your Text Here</li>
    </ul>
    </div>
    
    <div id="hideShow3">
    <ul id="phonetic3" class="sortable boxy" style="margin-left: 1em;">
    <center><a href="javascript: hidediv3()" style="color:red; text-decoration:none; font-size:11px;">[Hide List 3]</a></center>
    
    <li  >その</li>
    <li  >大き</li>
    <li  >な</li>
    <li  >桃</li>
    <li  >は</li>
    <li  >、</li>
    <li  >おばあさん</li>
    <li  >の</li>
    <li  >前(まえ)</li>
    <li  >まで</li>
    <li  >来(く)ると</li>
    <li  >、</li>
    <li  >ぴたり</li>
    <li  >と</li>
    <li  > 止(と)まり</li>
    <li  >ました</li>
    <li  >。</li>
    <li  >「</li>
    <li  >持(も)って</li>
    <li  >帰(かえ)って</li>
    <li  >おじいさん</li>
    <li  >と</li>
    <li  >一緒(いっしょ)</li>
    <li  > に</li>
    <li  >いただき</li>
    <li  >ましょう</li>
    <li  >かね</li>
    <li  >」</li>
    <li  >。</li>
    <li  >おばあさん</li>
    <li  >は</li>
    <li  >、</li>
    <li  >よっこらしょと</li>
    <li  >、</li>
    <li  >桃</li>
    <li  >を</li>
    <li  >拾(ひろ)って</li>
    <li  > 洗濯おけ</li>
    <li  >に</li>
    <li  >入(い)れる</li>
    <li  >と</li>
    <li  >、</li>
    <li  >家(いえ)まで</li>
    <li  > かかえて</li>
    <li  >帰り</li>
    <li  >ました</li>
    <li  >。</li>
    <li  >。</li>
    <li id="item3" ondblClick="editItem3();"> Made By: Joel</li>
    </ul>
    </div>
    
    <!--
    <ul id="numeric" class="sortable boxier" style="margin-right: 1em;">
    </ul>
    -->
    
    <ul id="numeric2" class="sortable boxier" style="margin-right: 1em;">
    Start
    </ul>
    
    <ul id="numeric3" class="sortable boxier" style="margin-right: 1em;">
    #1
    </ul>
    
    <ul id="numeric4" class="sortable boxier" style="margin-right: 1em;">
    #2
    </ul>
    
    <ul id="numeric5" class="sortable boxier" style="margin-right: 1em;">
    <br>
    END
    </ul>
    
    <!--
    <ul class="sortable boxier" id="numeric6" style="margin-right: 1em;" name="numeric6">
    <br>
    End
    </ul>
    -->
    
    <input type="button" value="show story" onClick="showNumeric2();" style="position: absolute; top: 708px; right: 14px;">
    
    <script language="javascript">
    function setCopy(textarea) {
    textarea.cols = 30;
    textarea.rows = 20;
    }
    function closeCopy(textarea) {
    textarea.cols = 10;
    textarea.rows = 10;
    } 
    </script>
    
    <!--
    <a href="#bottom" 2style="position: absolute; left: 300px; bottom: 0px">Bottom</a>
    -->
    
    <!--
    <a href="#" onClick="self.scrollTo(0,0)" style="position: absolute; left: 300px; bottom: 0px">Top</a>
    -->
    
    <textarea id="div2" style="position: absolute; z-index: 20; top: 738px; right: 14px; width: 571px; height: ; border-color: #CCCCCC; border: solid; border-width: 1px; text-color: black; background-color: #EEEEEE;" 
    
    name="x" onFocus="setCopy(this)" onBlur="closeCopy(this)" cols="10" rows="10">You have not saved your story yet. Click the "Show Story" button...</textarea>
    
    <script>
    function storyPrint() {
    printWin = window.open
    ('printWin.html','printWin','width=800,height=600,top=0,left=100,screenX=0,screenY=0,resizable=1,scrollbars=1,titlebar=0,toolbar=0,menubar=1,status=0,directories=0');
    //printWin.moveTo(0,0);
    printWin.document.write('<title>Print Your Story!</title><center><font style="color: black; font-size: 16px;"><b>Momotaro Student Rewrite</b></font><br><iframe src="composer.html" width="100%" 
    
    height="22" scrolling="no" frameborder="0"></iframe><br><a href="javascript: window.print(true);" style="color: gray; font-size: 12px;">Print My Story</a> <font style="color: gray; font-size: 12px;">/</font> 
    
    <a href="javascript: window.close(true);" style="color: gray; font-size: 12px;">Close this Window</a><br><P></center><font style="color: black; font-size: 16px;">' + div2.innerHTML + '</font>');
    }
    </script>
    
    <input type="button" value="print story" onClick="storyPrint();" style="position: absolute; top: 708px; right: 134px;">
    
    
    
    
    <SCRIPT LANGUAGE="JavaScript">
    <!--
    
    function changeName() {
      var now = new Date();
      fixDate(now);
      now.setTime(now.getTime() + 365 * 24 * 60 * 60 * 1000);
      username = prompt("Please enter your name:", "");
      setCookie("username", username, now);
    }
    
    // -->
    </SCRIPT>
    
    
    
    <SCRIPT LANGUAGE="JavaScript">
    <!--
    
    // create an instance of the Date object
    var now = new Date();
    // fix the bug in Navigator 2.0, Macintosh
    fixDate(now);
    /*
    cookie expires in one year (actually, 365 days)
    365 days in a year
    24 hours in a day
    60 minutes in an hour
    60 seconds in a minute
    1000 milliseconds in a second
    */
    now.setTime(now.getTime() + 365 * 24 * 60 * 60 * 1000);
    var username = getCookie("username");
    // if the cookie wasn't found, ask for the name
    if (!username) {
      username = prompt("Please enter the names of all paticipants, seperated by commas: \r\n(e.g. Josh, Jane, and Mary)", "");
    }
    /////////////
    function usrhelp() {
    deleteCookie('username');
    }
    ///////////
    // set the new cookie
    //////////////////////////////////////////////////
    
    if(username == "null") {
    	username = "Anonymous";
    // document.write("<div style='position: absolute; top: 0px; left: 283px; color: blue; font-size: 16px;'>You are not signed in.<INPUT TYPE='button' VALUE='sign in' onClick='usrhelp(); location.reload(true);' 
    
    //style='height: 20px; width: 75px; padding: 0px; padding-left: 0px; margin: 0px; margin-left: 0px; font-size: 12px; color: red;'></div>");
    }
    /////////////////////////////////////////////////
    
    setCookie("username", username, now);
    if (username) {
      document.write("<div style='position: absolute; top: 0px; left: 276px; color: blue; font-size: 16px;'>" + username + ".<span style='position: absolute; left: 24px; top: 20px;'><center><INPUT TYPE='button' 
    
    VALUE='new user' onClick='usrhelp(); location.reload(true);' style='height: px; width: 70px; padding: 0px; padding-left: 0px; margin: 0px; margin-left: 0px; font-size: 12px; color: blue;'></span></center></div>");
      setCookie("username", username, now);
    } else {
    username = "Anonymous";
    document.write("<div style='position: absolute; top: 0px; left: 283px; color: blue; font-size: 16px;'>" + username + ".<span style='position: absolute; left: 20px; top: 20px;'><center><INPUT TYPE='button' 
    
    VALUE='new user' onClick='usrhelp(); location.reload(true);' style='height: px; width: 70px; padding: 0px; padding-left: 0px; margin: 0px; margin-left: 0px; font-size: 12px; color: blue;'></span></center></div>");
    username = "Anonymous";
    }
    
    
    /*
    setCookie("username", username, now);
    if (username) {
      document.write("<div style='position: absolute; top: 0px; left: 276px; color: blue; font-size: 16px;'>Composers: " + username + ". <br><center><INPUT TYPE='button' VALUE='this is wrong' onClick='usrhelp(); 
    
    location.reload(true);' style='height: px; width: px; padding: 0px; padding-left: 0px; margin: 0px; margin-left: 0px; font-size: 12px; color: red;'></center></div>");
      setCookie("username", username, now);
    } else {
    username = "Anonymous";
    document.write("<div style='position: absolute; top: 0px; left: 283px; color: blue; font-size: 16px;'>Composer: " + username + ". <br><center><INPUT TYPE='button' VALUE='sign in' onClick='usrhelp(); 
    
    location.reload(true);' style='height: px; width: px; padding: 0px; padding-left: 0px; margin: 0px; margin-left: 0px; font-size: 12px; color: red;'></center></div>");
    username = "Anonymous";
    }
    }
    */
    
    // -->
    </SCRIPT>
    
    <!--
    <table  style="position: absolute; top: 100px; left: 400px;">
    <FORM>
    <INPUT TYPE='button' VALUE='change name' onClick='changeName(); location.reload(true);'>
    </FORM>
    <FORM>
    <INPUT TYPE="button" VALUE="delete name" onClick="deleteCookie('username'); location.reload(true);">
    </FORM>
    </table>
    -->
    
    <!--
    <input id="div2" type="text" value="Your Story Here" style="position: absolute; z-index: 20; top: 706px; left: 400px; width: ; height: ;" name="x" onKeyUp="SetNewSize(this);" cols="5" rows="4">
    -->
    <!-- 
    <div id="div2" style="position: absolute; z-index: 20; top: 706px; left: 400px; width: 160px;">
    Story Goes Here:
    </div>
    -->
    </body>
    
    </html>
    Last edited by Leoj00; Mar 11, 2007 at 04:35. Reason: hehehe

  2. #2
    Programming Team silver trophybronze trophy
    Mittineague's Avatar
    Join Date
    Jul 2005
    Location
    West Springfield, Massachusetts
    Posts
    17,145
    Mentioned
    190 Post(s)
    Tagged
    2 Thread(s)

    errors

    The Opera error console shows quite a few CSS errors and this javascript error.
    JavaScript - http://rentev.com/leoj/Momotaro/dragdrop/index2.html
    Event thread: load
    Error:
    name: TypeError
    message: Statement on line 19: Could not convert undefined or null to object
    Backtrace:
    Line 19 of linked script http://rentev.com/leoj/Momotaro/dragdrop/dragdrop.js
    list.previousContainer = this.lastContainer;
    Line 79 of inline#10 script in http://rentev.com/leoj/Momotaro/dragdrop/index2.html
    DragDrop.makeListContainer(list);
    At unknown location
    [statement source code not available]

  3. #3
    SitePoint Zealot
    Join Date
    Mar 2007
    Posts
    191
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    thank you very much Mittin.


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •