javascript - Div not performing slideToggle() when clicking on image -

-

i want set portfolio when click on picture of "3dbanners", div id "firstbanners" opens up.

essentially, go this: http://prntscr.com/aufua6 this: http://prntscr.com/aufups slide down , up, hence slidetoggle().

here code:

#thumbnails {  	position:absolute;  	top:460px;  	-webkit-filter: drop-shadow(5px 5px 5px rgba(0,0,0,0.70));      filter:         drop-shadow(5px 5px 5px rgba(0,0,0,0.70));  }  .thumbs {  	cursor:pointer;  }  .bannercaptions {  	font-family: impact, haettenschweiler, "franklin gothic bold", "arial black", sans-serif;  	text-transform:capitalize;  	font-size:26px;  	color:#ffffff;  	padding:5px 0px 20px 0px;  }  .stillbanners {  	width:1500px;  }  #dayzsnowy {  	padding-top:15px;  }
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>  <center>  <div id="thumbnails" style="display:none;">  <a id="firstbannersthumb"><img src="../images/thumbnails/3dbanners.png" alt="3d banners" class="thumbs" /></a>  <div id="firstbanners">  	<img src="../images/still benners/dayzsnowy.png" alt="dayz snowy" id="dayzsnowy" class="stillbanners" />      <p id="dayzsnowycaption" class="bannercaptions">dayz snowy banner</p>      <img src="../images/still benners/infa.png" alt="infa space" id="infaspace" class="stillbanners" />      <p id="infaspacecaption" class="bannercaptions">infa space banner</p>      <img src="../images/still benners/l7zeon.png" alt="l7 zeon" id="l7zeon" class="stillbanners" />      <p id="l7zeoncaption" class="bannercaptions">l7 zeon banner</p>      <img src="../images/still benners/mythh.jpg" alt="void mythh" id="mythh" class="stillbanners" />      <p id="mythhcaption" class="bannercaptions">void mythh banner</p>      <img src="../images/still benners/l7artsriver.png" alt="l7 arts" id="l7artsriver" class="stillbanners" />      <p id="l7artsrivercaption" class="bannercaptions">l7 arts banner</p>      <img src="../images/still benners/insan3lik3var2.jpg" alt="insan3lik3" id="insan3lik3" class="stillbanners" />      <p id="insan3lik3caption" class="bannercaptions">insan3lik3 banner</p>      <img src="../images/still benners/soulja.jpg" alt="s3 soulja" id="soulja" class="stillbanners" />      <p id="souljacaption" class="bannercaptions">s3 soulja banner</p>      <img src="../images/still benners/zorich.jpg" alt="zorich" id="zorich" class="stillbanners" />      <p id="zorichcaption" class="bannercaptions">zorich banner</p>      <img src="../images/still benners/invade.png" alt="l7 invade" id="invade" class="stillbanners" />      <p id="invadecaption" class="bannercaptions">l7 invade banner</p>      <img src="../images/still benners/examplefx.jpg" alt="examplefx" id="examplefx" class="stillbanners" />      <p id="examplefxcaption" class="bannercaptions">examplefx banner (this 3d because buildings in background 3d modelled)</p>      <img src="../images/still benners/whiz.jpg" alt="soar whiz" id="whiz" class="stillbanners" />      <p id="whizcaption" class="bannercaptions">soar whiz banner</p>      <img src="../images/still benners/compleqz.jpg" alt="compleqz" id="compleqz" class="stillbanners" />      <p id="compleqzcaption" class="bannercaptions">compleqz banner</p>      <img src="../images/still benners/troopa.jpg" alt="troopa" id="troopa" class="stillbanners" />      <p id="troopacaption" class="bannercaptions">troopa banner</p>      <img src="../images/still benners/mega3.jpg" alt="mega" id="mega" class="stillbanners" />      <p id="megacaption" class="bannercaptions">mega banner</p>  </div>  <a class="thumbs"><img src="../images/thumbnails/2dbanners.png" alt="2d banners" id="2dbannersthumb" /></a>  <a class="thumbs"><img src="../images/thumbnails/gifbanners.png" alt="gif banners" id="gifbannersthumb" /></a>  </div>  </center>  <script type="text/javascript">  $(document).ready(function() {      $("#firstbannersthumb").click(function() {          $("#firstbanners").slidetoggle(1000);      });  });  </script>

try change jquery version. replace this

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>

for this

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.2/jquery.min.js"></script>


Comments

Post a Comment

Popular posts from this blog

java - nested exception is org.hibernate.exception.SQLGrammarException: could not extract ResultSet Hibernate+SpringMVC -

-
i trying fetch records database , having above error this classs appropriate getters , setters public class user { private int id; private string username; private string password; private string email; i have create database , inserted data below configuration <bean id="datasource" class="org.apache.commons.dbcp2.basicdatasource" destroy-method="close"> <property name="driverclassname" value="com.mysql.jdbc.driver"/> <property name="url" value="jdbc:mysql://localhost:3306/usersdb"/> <property name="username" value="root"/> <property name="password" value=""/> </bean> this complete stacktrace severe: servlet.service() servlet [appservlet] in context path [/spring] threw exception [request processing failed; nested exception org.hibernate.exception.sqlgrammarexception: not ...
Read more

sql - Postgresql tables exists, but getting "relation does not exist" when querying -

-
Image
i have postgresql db number of tables. if query: select column_name information_schema.columns table_name="my_table"; i list of columns returned properly. however, when query: select * "my_table"; i error: (programmingerror) relation "my_table" not exist 'select *\n "my_table"\n' {} any thoughts on why can columns, can't query table? goal able query table. you have include schema if isnt public one select * <schema>."my_table" or can change default schema show search_path; set search_path my_schema; check table schema here select * information_schema.columns for example if table on default schema public both works ok select * parroquias_region select * public.parroquias_region but sectors need specify schema select * map_update.sectores_point
Read more

asp.net mvc - breakpoint on javascript in CSHTML? -

-
i have .cshtml file has javascript tag. within script tag have few lines of javascript. first line of javascript refers property in @viewbag. other javascript lines plain script without mvc related references. observation: can place breakpoints (visual studio 2015) on each of these javascript lines. however, breakpoints has white dot in center of breakpoint symbol (red circle) except line @viewbag reference (this particular line not have white dot in center). it seems breakpoint without white dot hit during run-time. question: can explain going on here? white dot mean? why plain red breakpoint line line hitting breakpoint? the visual studio debugger expecting debug actual server-side code within .cshtml file opposed client-side javascript within it. iirc, visual studio allow debug javascript code expected in internet explorer (and possibly edge), other browsers want use either third-party tool or developer tools (f12) within browser. an easy approach take advant...
Read more