javascript - Scale Background CSS with Slider -

-

i working css backgrounds (http://css3pie.com/demos/gradient-patterns/) in application , want able scale design slider. here's jsfiddle. able scale x & y separately on stripes , picnic designs had play background-size:50px 50px; this:

//setup variables based off css set using dropdown griditems = $(document.activeelement).val().split("; "); (i = 0; < griditems.length -1; i++) {     gridsettings = griditems[i].split(":");      if (gridsettings[0]=="background-size"){         gridsize = gridsettings[1].split(" ");         gridx = gridsize[0];         gridy = gridsize[1]         }    //on action of slide - update value     $('#gridxy-'+key).on("slide", function(slideevt) {         gridxy = slideevt.value;         $('.draggable-' + currentlayer).css("background-size", "calc("+ gridx +" * "+ gridxy +") calc("+ gridy +" * "+ gridxy +")");     });

which can set either numerically or using when gets blue print has lot more settings background-size:100px 100px, 100px 100px, 20px 20px, 20px 20px;

i trying right can take variable number of those, , can write work, method have in mind messy, hoping scaling might little cleaner do.

i did find this:http://codepen.io/erik/pen/jgnsb using less declare variables, if possible stay away that.

update: here jsfiddle of it: http://jsfiddle.net/4l3d9qh2/

i added function should have let me update it, reason calc() function doesn't seem working update div style. after processing, looks this: $('.draggable-0').css("background-size", calc(100px - 4) calc(100px - 4), calc(100px - 4) calc(100px - 4), calc(20px - 4) calc(20px - 4), calc(20px - 4) calc(20px - 4));

$.each(gridsizearray, function( k, v ){             if (gridincrement==1)             {                 gridxy = "calc(" + v +" - " + value + ") ";             }else{                 if(isodd(gridincrement)){                 gridxy = gridxy + "calc(" + v +" - " + value + ") ";                 }else{                 gridxy = gridxy + "calc(" + v +" - " + value + "), ";                 }             }               gridincrement++             })

here final code works. using .each() loop through , if even, add comma, remove last comma @ end.

                griditems = $(document.activeelement).val().split("; ");                  (i = 0; < griditems.length -1; i++) {                     gridsettings = griditems[i].split(":");                      if (gridsettings[0]=="background-size"){                         gridsizestring = gridsettings[1].replace(/,/gi, '');                         gridsizearray = gridsizestring.split(" ");                         }                      $('[data-type="sliderlayer"][data-layer="'+currentlayer+'"][data-slide="'+currentslide+'"]').css(gridsettings[0], gridsettings[1]);                  }              $.each(gridsizearray, function( k, v ){             if (gridincrement==1)             {                 gridxy = "calc(" + v +" + " + value + "px) ";             }else{                 if(isodd(gridincrement)){                 gridxy = gridxy + " calc(" + v +" + " + value + "px) ";                 }else{                 gridxy = gridxy + "calc(" + v +" + " + value + "px),";                 }             }             gridincrement++             })             if (isodd(gridincrement))                 {                     gridxy = gridxy.substring(0, gridxy.length - 1);                 }

Comments

Post a Comment

Popular posts from this blog

c++ - No viable overloaded operator for references a map -

-
i trying use map can make tag names reference number. when try , use it, in code error (6 in total every time reference map): src/main.cpp:25:45: error: no viable overloaded operator[] type 'std::map<std::string, std::string>' const char* idcs = node.child_value(tagmap[3]); this code: #include "pugi/pugixml.hpp" #include <iostream> #include <string> #include <map> int main() { pugi::xml_document doca, docb; std::map<std::string, pugi::xml_node> mapa, mapb; std::map<std::string, std::string> tagmap {{"1", "data"}, {"2", "entry"}, {"3", "id"}, {"4", "content"}}; if (!doca.load_file("a.xml") || !docb.load_file("b.xml")) { std::cout << "can't find input files"; return 1; } (auto& node: doca.child(tagmap[1]).children(tagmap[2])) { co
Read more

java - Custom OutputStreamAppender not run: LOGBACK: No context given for <MYAPPENDER> -

-
i wish write custom appender on basis of outputstreamappender . wrote following class package tests; import java.io.ioexception; import java.io.outputstream; import ch.qos.logback.core.outputstreamappender; public class myappender<e> extends outputstreamappender<e> { public myappender() { system.out.println("myappender created"); setoutputstream(new outputstream() { @override public void write(int b) throws ioexception { throw new unsupportedoperationexception(); } }); } } then wrote following runner: package tests; import org.slf4j.loggerfactory; import ch.qos.logback.classic.logger; public class runner { private static final logger log = (logger) loggerfactory.getlogger(runner.class); public static void main(string[] args) { //log.addappender(new myappender<iloggingevent>()); log.info("hello world"); } } finall
Read more

java - Cannot secure connection using TLS -

-
i'm trying establish secure socket connection between java client applet (built jdk 1.7.0_75-b13) , vc++ server application. as test vehicle, used vc++ client/server sample found in msdn forums, modified use schannel , able establish socket using cipher suite tls_rsa_with_aes_128_cbc_sha. works of tls 1.0/1.1/1.2. when try opening socket java applet same server application, connection rejected server reporting following: tls 1.0 acceptsecuritycontext failed: 0x80090327 tls 1.1 acceptsecuritycontext failed: 0x80090331 tls 1.2 acceptsecuritycontext failed: 0x80090331 this java code used create socket: debugprint("setting secure connection"); sslsocketfactory sslsocketfactory = (sslsocketfactory) sslsocketfactory.getdefault(); sslsocket sslsocket = (sslsocket) sslsocketfactory.createsocket("127.0.0.1", socketnumber); debugprint("starting handshake"); sslsocket.settcpnodelay(true); sslsocket.setsolinger(false, 0); sslsocket.s
Read more