Kommentierfunktion
Hi, ich wollte gerade eine Kommentierfunktion schreiben, welche bereits einige Kommentare vorgefertigt hat, hatte auch schon mal eine und dachte diese verstanden zu haben, leider finde ich die Datei nicht mehr. Kannst du mir sagen wo ich hier einen Fehler eingebaut habe?
Okay ich habe hier heute ein wenig rumprobiert. Ist es möglich, dass immer nur die zwei neusten Kommentare angezeigt werden und der rest in einem "Mehr anzeigen" button verschwindet?
Der hier verwendete Code
<script src="/js_webseite/jquery.js"></script>
<style>
*{
margin:0;
padding:0;
}
.kommentare{
height:20px;
}
#kommentarspalte{
width:100%;
display:inline-block;
background:lightgrey;
min-height:40px;
height:40px;
overflow:hidden;
border:2px solid red;
}
#mehr{
position:fixed;
left:600px;
top:20px;
font-size:30px;
text-align:center;
}
textarea{
text-align:center;
height:100px;
width:60%;
margin-left:20%;
}
#komsend{
text-align:center;
width:300px;
margin-left:calc(50% - 150px);
height:30px;
font-size:25px;
border-radius:5px;
border:2px solid black;
box-shadow:2px 2px 2px;
}
</style>
<div id="kommentarspalte">
<div id="helfer">
<div id="kommentare1" class="kommentare">Hallo</div>
<div id="kommentare2" class="kommentare">tschüss</div>
</div>
</div>
<span>
<input type="button" class="but" data-wert="1" id="a2" value="Zeige alle Beiträge">
</span><br>
<textarea id="komschr"></textarea><br>
<button id="komsend">senden</button>
<script>
var d=3;
document.getElementById('komsend').onclick=function(){
var kommi = document.createElement("div");
d++;
kommi.id="kommentare"+d;
kommi.innerHTML=document.getElementById("komschr").value+' test '+d;
kommentarspalte.appendChild(kommi);
h=$('.but').data('wert');
if(h==2){
}else{
h=d-3;
pix1=h*18;
$('#helfer').css('marginTop','-'+pix1+'px');
}
buttons();
}
$('.but').click(function(){
pix2=d*18;
h=$('.but').data('wert');
if(h==2){
$('.but').data('wert','1');
$('.but').attr('value','Zeige mehr');
h=d-3;
pix1=h*18;
$('#helfer').css('marginTop','-'+pix1+'px');
$('#kommentarspalte').css('height','40px');
} else{
$('.but').data('wert','2');
pix2=d*18;
$('.but').attr('value','wenniger');
$('#helfer').css('marginTop','0px');
$('#kommentarspalte').css('height','auto');
}
});
</script>