andriprasetiya
-
Posts
10 -
Joined
-
Last visited
Content Type
Profiles
Forums
Events
Posts posted by andriprasetiya
-
-
-
58 minutes ago, justsomeguy said:
OK, you answered one out of three. What exactly happens when you run it? Are there error messages in the developer console? How about in the network console, is there anything listed as not loading?
You'll find that you get better answers when you ask better questions. If you make it easy for people to help you then people will be more likely to help you.
LOOK why the live preview isn't working, what the wrong of the javascript code?
-
-
-
-
-
this code is not working, please to tell me Where the location of his code error
<!DOCTYPE HTML>
<html lang="en-US">
<head>
<style>
/*************************
* Global Style
*************************/*{
margin:0;
padding:0;
font-family:"TheSans"calibri,arial,sans-serif;
color:#333;
}
html{height:100%;}
.clearfix{clear:both;}/*************************
* Header, Toolbar
*************************/
#header{background:url("https://dl.dropbox.com/u/26808427/cdn/ariona/demo/text-editor/grid_noise.png")}
#logo{
margin:10px 0 10px 10px;
display: inline-block;
}
#toolbar{
border-top:1px solid #e3e3e3;
border-bottom:1px solid #e3e3e3;
height:20px;
padding:10px;
box-shadow:0 5px 10px -7px rgba(0,0,0,.3);
height:30px;
background: -webkit-linear-gradient(top,#fff,#efefef);
}
#editor-toolbar,#preview-toolbar{
width:50%;
float:left;
}
#toolbar h2{
font-weight:normal;
text-shadow:0 1px 1px white;
color:#888;
line-height:35px;
display: inline-block;
}
.icon{
font-family:"web symbols";
margin-right:20px;
font-size:16px;
position: relative;
top:-2px;
color:#888;
}#toolbar ul{list-style:none;float:right;margin-right:20px;}
#toolbar ul li{float:left;}.button{
padding:5px 10px;
border:1px solid #e3e3e3;
border-radius:3px;
cursor:pointer;
background: -webkit-linear-gradient(top,#fff,#eee);
box-shadow:0 1px 1px white;
}
#download{
padding:0;width:100px;height:30px;
border:1px solid #e3e3e3;
border-radius:3px;
cursor:pointer;
box-shadow:0 1px 1px white;
position: relative;
z-index:2;
}
#download:after{
content:"Download";
position: absolute;
top:0;left:0;
width:100px;
height:25px;
padding-top:5px;
text-align:center;
background: -webkit-linear-gradient(top,#fff,#eee);
z-index:-1;
}
/*************************
* IDE (EDITOR & PREVIEW)
*************************/
#ide{
position: absolute;
padding-top:10px;
top:150px;
left:0;
right:0;
bottom:10px;
}
#editor, #preview{
width:50%;
float:left;
height:100%;
position:relative;
}
.container{
height:100%;
position: absolute;
top:-10px;
left:0;
right:0;
bottom:10px;
}
#editor .container{
border-right:1px solid #e3e3e3;
bottom:0;
}
.container textarea,.container iframe,.CodeMirror{
height:100%;
width:100%;
resize:none;
border:none;
outline:none;
}
.container iframe{
position:absolute;
}/*************************
* CodeMirror Style Fix
*************************/
.CodeMirror-scroll{height:100% !important}
.CodeMirror-gutter,.CodeMirror-lines{line-height:20px;}::-webkit-scrollbar {
width : 5px;
height: 5px;
}
::-webkit-scrollbar-thumb {
-webkit-border-radius: 10px;
border-radius : 10px;
background : #A8DAEA;
}
::-webkit-slider-thumb element,
::-webkit-scrollbar-track {
background : white;
-webkit-border-radius: 10px;
border-radius : 10px;
}</style>
<link rel="stylesheet" href="style.css">
<link rel="stylesheet" href="codemirror.css">
<script type="text/javascript" src="codemirror.js"></script>
<script type="text/javascript" src="javascript.js"></script>
<script type="text/javascript" src="css.js"></script>
<script type="text/javascript" src="htmlmixed.js"></script>
<script type="text/javascript" src="xml.js"></script>
<script type="text/javascript" src="zen_codemirror.js"></script>
<script type="text/javascript" src="downloadify.min.js"></script>
<script type="text/javascript" src="swfobject.js"></script>
<meta charset="UTF-8">
<title>Ariona Live Text Editor</title>
</head>
<body >
<div id="header">
<a href="http://www.ariona.net" id="logo"><img src="logo.png" alt=""></a>
<div id="toolbar">
<div id="editor-toolbar">
<h2><span class="icon">H</span>Editor</h2>
<ul>
<li id="download">Download</li>
</ul>
</div>
<div id="preview-toolbar">
<h2><span class="icon">L</span>Preview</h2>
</div>
</div>
</div>
<script type="text/javascript" src="zen_codemirror.js"></script>
<div id="ide">
<div id="editor">
<div class="container"><textarea name="" id="editor-area" cols="30" rows="10"></textarea></div>
</div>
<div id="preview">
<div class="container"><iframe src="" frameborder="0"id="preview-area" ></iframe></div>
</div>
</div>
<script type="text/javascript">
var delay;
var editor = CodeMirror.fromTextArea(document.getElementById('editor-area'), {
mode: 'text/html',
tabSize:8,
lineNumbers:true,
onChange: function() {
clearTimeout(delay);
delay = setTimeout(updatePreview, 0);
},
onKeyEvent: function() {
return zen_editor.handleKeyEvent.apply(zen_editor, arguments);
}
});
function updatePreview() {
var previewFrame = document.getElementById('preview-area');
var preview = previewFrame.contentDocument || previewFrame.contentWindow.document;
preview.open();
preview.write(editor.getValue());
preview.close();
}
setTimeout(updatePreview, 0);
Downloadify.create('download',{
filename: "index.html",
data: function(){
return editor.getValue();
},
onComplete: function(){
alert('Your file has been saved!');
},
onCancel: function(){
alert('You have cancelled the saving of this file.');
},
onError: function(){
alert('You must put something in the File Contents or there will be nothing to save!');
},
transparent: false,
swf: 'downloadify.swf',
downloadImage:'download.png',
width: 100,
height: 30,
transparent: true,
append: false
});
</script>
</body>
</html> -
-
help me
in General
Posted
coder mirror is same as text editor