Guten Tag
Ich bin eben noch nicht so geübt mit Forumbeiträgen...
Also bei mir wird mit dem JQuery (Im Adobe Dreamweaver) alles angezeigt. Aber auch diesen Tipp werde ich dieses mal umsetzten.
Ich sehe in dem von dir geposteten, letzten Beitrag kein .click(), da kann ich dir also nicht helfen.
Das liegt daran das ich eben in JQuery noch nicht so geübt bin. (
Den Text den ich in Klammern des Befehls geschrieben habe wurde in der Konsole angezeig und dadurch habe ich gedacht das sei so richtig.)
Hier mal mein aktueller Code: (die Animation habe ich heute morgen bisschen verändert)
HTML:
<html>
<head>
<title>
</title>
<meta charset="utf-8"/>
<link rel="stylesheet" href="main.css"/>
<link rel="stylesheet" href="font.css"/>
<script language="javascript" type="text/javascript" src="jquery.js"></script>
<script language="javascript" type="text/javascript" src="search.js"></script>
</head>
<body>
<header>
<div class="header_content">
<div class="header_content_logo">
</div>
<div class="header_content_link">
<a href="index.html" id="link" class="active">HOME</a>
<tab></tab>
<a href="index.html" id="link">WORKS</a>
<tab></tab>
<a href="index.html" id="link">CLIENTS</a>
<tab></tab>
<a href="index.html" id="link">SING IN</a>
<tab></tab>
<input type="button" class="srcbtn" value="">
</div>
<div id="searchbar">
<!-- Hier wäre ein Eingabefeld für die Suchfunktion -->
</div>
</div>
</header>
</body>
</html>
CSS:
body{
font-size: 12.5px;
text-decoration: none;
}
header{
background-color: #181818;
opacity: ;
height: 100px;
position: fixed;
margin-left: -10%;
margin-right: -10%;
width: 120%;
top: -5px;
}
div.header_content{
position: relative;
left: 50%;
top: 63px;
}
div.header_content_link{
position: relative;
left: 200px;
}
a{
text-decoration: none;
font-family: Lato;
color: white;
text-transform: uppercase;
}
#link:hover{
border-bottom: 3px solid #938782;
padding-bottom: 9px;
transition: 0.5s ease;
}
a.active{
border-bottom: 3px solid #938782;
padding-bottom: 9px;
}
tab{
padding-left: 40px;
}
.srcbtn{
margin-top: -18px;
margin-left: 360px;
height: 17px;
width: 20px;
background: url(src_btn.png) no-repeat;
background-size: 17px;
display: block;
position: relative;
border: none;
}
#searchbar{
background: grey;
margin-left: 175px;
margin-top: -30px;
height: 42px;
width: 370px;
opacity: 100;
display: none;
position: relative;
}
Javascript:
$(document).ready(function(){
$('.srcbtn').click()(function(){
$("#searchbar").animate({
display: 'true',
width: '300px',
opacity: 'toggle'
});
});
});
Um den Fragen wo das JQuery geblieben ist schon mal vorzubeugen: Ich habe es von der Seite:
http://code.jquery.com/jquery-1.12.0.min.js kopiert und in die lokale jquery.js datei eingefügt.
In der Konsole wird momentan folgendes ausgegeben:
TypeError: $(...).click(...) is not a function . . . . . . . . . . . . . . . . . . . . . search.js:2:2
Gut jetzt hoffe ich das dies eine vollständige Antwort war und diese offenen, von mir nicht beantworteten Fragen, klären konnte!
Gruss
WIS
