image - A javascript that sets a height/margin if img is a certain height -


basically want do, set img height 100% if shorter 160px/10em on screen. have no experience javascript though. after few googles came up.

if ($('#photo_crop img').height() < 160) {     ('#photo_crop img').style.height = "100%";}

however surprising not work. here html use.

<div id="photo_crop"><img src="{photourl-highres}" alt="{photoalt}" /></div>

and css.

    #photo_crop {     height:64%;     overflow:hidden;     }  #photo_crop img {     transition:margin-bottom 0.333s, margin-top 0.333s;     margin-bottom:-16%;     margin-top:-16%;     z-index:-1; }  #photo_crop:hover {     height:100%; }  #photo_crop img:hover {     margin-bottom:0;     margin-top:0; }

as can see code crops picture until hover on shows entire picture.this save space on tumblr blog. works great unless wide picture, example panorama because panorama cropped , way small. solving appreciated.

there no "then" in javascript. forgot second $-sign in front of second brackets , guess can not use "100%" check height.


Comments

Post a Comment

Popular posts from this blog

matlab - Deleting rows with specific rules -

i got 20*3 cell array , need delete rows contains "137", "2" , "n:t" origin data: 't' '' '' 'np(*)' '' '' [ 137] '' '' [ 2] '' '' 'are' 'and' 'np(fcc_a1#1)' '' '' '1:t' [ 1200] [0.7052] '' [1.2051e+03] [0.7076] '' 'are' 'and' 'np(fcc_a1#3)' '' '' '2:t' [ 1200] [0.0673] '' [1.2051e+03] [0.0671] '' 'are' 'and' 'np(m23c6)' '' '' '3:t' [ 1200] [0.227...
Read more

jquery - How would i go about shortening this code? And to cancel the previous click on click of new section? -

my code below changes image people in team sector, can see theres alot of repeated code; there way shorten it? also currently, allows click on sections without turning off clicked one; assume toggle() function, couldn't work other way! still quite new jquery coding, grand!! cheers in advance! $("#team_client_services").click(function () { if ($(".team_client_services").hasclass("team_hide")) { $(".team_client_services").toggleclass("team_hide"); $(".team_client_services2").toggleclass("team_show"); } else { $(".team_client_services").toggleclass("team_hide"); $(".team_client_services2").toggleclass("team_show"); }; }); $("#team_management").click(function () { if ($(".team_management").hasclass("team_hide")) { $(".team_management").toggleclass("team_hide"); $(".team_management2...
Read more