{"id":6655,"date":"2014-09-24T18:34:05","date_gmt":"2014-09-24T21:34:05","guid":{"rendered":"http:\/\/www.viamais.net\/blog\/?p=6655"},"modified":"2014-09-24T18:34:05","modified_gmt":"2014-09-24T21:34:05","slug":"como-mudar-propriedades-css-com-jquery","status":"publish","type":"post","link":"https:\/\/www.viamais.net\/blog\/como-mudar-propriedades-css-com-jquery\/","title":{"rendered":"Como mudar propriedades CSS com JQuery"},"content":{"rendered":"

Veja como mudar propriedades CSS com JQuery de uma forma simples e f\u00e1cil, esta dica vai ajudar voc\u00ea a montar seu layout de modo din\u00e2mico e interativo.<\/em><\/h2>\n

[ad#texto]<\/p>\n

\u00c9 comum surgir a necessidade de manipularmos CSS<\/a><\/strong> em tempo de execu\u00e7\u00e3o e a melhor forma de realizar esta tarefa \u00e9 utilizando JQuery<\/strong><\/a>.<\/p>\n

\"Como<\/a>
Como mudar propriedades CSS com JQuery<\/figcaption><\/figure>\n

Veja como mudar propriedades CSS com JQuery<\/a><\/strong> de forma muito simplificada:<\/p>\n

HTML:<\/strong><\/p>\n

<div>\r\n <p>Exemplo de par\u00e1grafo!!!<\/p>\r\n<\/div>\r\n<\/pre>\n
Agora vamos adicionar um fundo cinza em tempo de execu\u00e7\u00e3o:<\/p>\n
$(\"div\").css(\"background\", \"#ccc\");\r\n<\/pre>\n
Agora vamos explicar como mudar propriedades CSS com JQuery<\/strong>, o primeiro trecho \u00e9 puro HTML, ele \u00e9 que ser\u00e1 manipulado e o segundo trecho \u00e9 um pequeno c\u00f3digo-fonte JQuery<\/strong> que vai efetivamente alterar a renderiza\u00e7\u00e3o atrav\u00e9s do .css()<\/a> do JQuery<\/strong>.<\/p>\n
No $()<\/strong> voc\u00ea vai selecionar o elemento pelo TAGNAME<\/em>, pela classe ou pelo ID do elemento e o .css()<\/strong> \u00e9 adicionado a propriedade CSS<\/strong> que ser\u00e1 manipulada e em seguida o seu valor.<\/p>\n
Por\u00e9m \u00e9 preciso tomar um cuidado, embora v\u00e1rias propriedades CSS<\/strong> sejam iguais em um arquivo CSS<\/strong> “puro”<\/em> e no JQuery<\/strong> alguma delas ter\u00e3o pequenas diferen\u00e7as de escrita, veja uma tabela de convers\u00e3o:<\/p>\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n
Propriedade \u2013 CSS<\/strong><\/th>\nRefer\u00eancia \u2013 JavaScript<\/strong><\/th>\n<\/tr>\n
background<\/td>\nbackground<\/td>\n<\/tr>\n
background-attachment<\/td>\nbackgroundAttachment<\/td>\n<\/tr>\n
background-color<\/td>\nbackgroundColor<\/td>\n<\/tr>\n
background-image<\/td>\nbackgroundImage<\/td>\n<\/tr>\n
background-position<\/td>\nbackgroundPosition<\/td>\n<\/tr>\n
background-repeat<\/td>\nbackgroundRepeat<\/td>\n<\/tr>\n
border<\/td>\nborder<\/td>\n<\/tr>\n
border-bottom<\/td>\nborderBottom<\/td>\n<\/tr>\n
border-bottom-color<\/td>\nborderBottomColor<\/td>\n<\/tr>\n
border-bottom-style<\/td>\nborderBottomStyle<\/td>\n<\/tr>\n
border-bottom-width<\/td>\nborderBottomWidth<\/td>\n<\/tr>\n
border-color<\/td>\nborderColor<\/td>\n<\/tr>\n
border-left<\/td>\nborderLeft<\/td>\n<\/tr>\n
border-left-color<\/td>\nborderLeftColor<\/td>\n<\/tr>\n
border-left-style<\/td>\nborderLeftStyle<\/td>\n<\/tr>\n
border-left-width<\/td>\nborderLeftWidth<\/td>\n<\/tr>\n
border-right<\/td>\nborderRight<\/td>\n<\/tr>\n
border-right-color<\/td>\nborderRightColor<\/td>\n<\/tr>\n
border-right-style<\/td>\nborderRightStyle<\/td>\n<\/tr>\n
border-right-width<\/td>\nborderRightWidth<\/td>\n<\/tr>\n
border-style<\/td>\nborderStyle<\/td>\n<\/tr>\n
border-top<\/td>\nborderTop<\/td>\n<\/tr>\n
border-top-color<\/td>\nborderTopColor<\/td>\n<\/tr>\n
border-top-style<\/td>\nborderTopStyle<\/td>\n<\/tr>\n
border-top-width<\/td>\nborderTopWidth<\/td>\n<\/tr>\n
border-width<\/td>\nborderWidth<\/td>\n<\/tr>\n
clear<\/td>\nclear<\/td>\n<\/tr>\n
clip<\/td>\nclip<\/td>\n<\/tr>\n
color<\/td>\ncolor<\/td>\n<\/tr>\n
cursor<\/td>\ncursor<\/td>\n<\/tr>\n
display<\/td>\ndisplay<\/td>\n<\/tr>\n
filter<\/td>\nfilter<\/td>\n<\/tr>\n
font<\/td>\nfont<\/td>\n<\/tr>\n
font-family<\/td>\nfontFamily<\/td>\n<\/tr>\n
font-size<\/td>\nfontSize<\/td>\n<\/tr>\n
font-variant<\/td>\nfontVariant<\/td>\n<\/tr>\n
font-weight<\/td>\nfontWeight<\/td>\n<\/tr>\n
height<\/td>\nheight<\/td>\n<\/tr>\n
left<\/td>\nleft<\/td>\n<\/tr>\n
letter-spacing<\/td>\nletterSpacing<\/td>\n<\/tr>\n
line-height<\/td>\nlineHeight<\/td>\n<\/tr>\n
list-style<\/td>\nlistStyle<\/td>\n<\/tr>\n
list-style-image<\/td>\nlistStyleImage<\/td>\n<\/tr>\n
list-style-position<\/td>\nlistStylePosition<\/td>\n<\/tr>\n
list-style-type<\/td>\nlistStyleType<\/td>\n<\/tr>\n
margin<\/td>\nmargin<\/td>\n<\/tr>\n
margin-bottom<\/td>\nmarginBottom<\/td>\n<\/tr>\n
margin-left<\/td>\nmarginLeft<\/td>\n<\/tr>\n
margin-right<\/td>\nmarginRight<\/td>\n<\/tr>\n
margin-top<\/td>\nmarginTop<\/td>\n<\/tr>\n
overflow<\/td>\noverflow<\/td>\n<\/tr>\n
padding<\/td>\npadding<\/td>\n<\/tr>\n
padding-bottom<\/td>\npaddingBottom<\/td>\n<\/tr>\n
padding-left<\/td>\npaddingLeft<\/td>\n<\/tr>\n
padding-right<\/td>\npaddingRight<\/td>\n<\/tr>\n
padding-top<\/td>\npaddingTop<\/td>\n<\/tr>\n
page-break-after<\/td>\npageBreakAfter<\/td>\n<\/tr>\n
page-break-before<\/td>\npageBreakBefore<\/td>\n<\/tr>\n
position<\/td>\nposition<\/td>\n<\/tr>\n
float<\/td>\nstyleFloat<\/td>\n<\/tr>\n
text-align<\/td>\ntextAlign<\/td>\n<\/tr>\n
text-decoration<\/td>\ntextDecoration<\/td>\n<\/tr>\n
text-decoration: blink<\/td>\ntextDecorationBlink<\/td>\n<\/tr>\n
text-decoration: line-through<\/td>\ntextDecorationLineThrough<\/td>\n<\/tr>\n
text-decoration: none<\/td>\ntextDecorationNone<\/td>\n<\/tr>\n
text-decoration: overline<\/td>\ntextDecorationOverline<\/td>\n<\/tr>\n
text-decoration: underline<\/td>\ntextDecorationUnderline<\/td>\n<\/tr>\n
text-indent<\/td>\ntextIndent<\/td>\n<\/tr>\n
text-transform<\/td>\ntextTransform<\/td>\n<\/tr>\n
top<\/td>\ntop<\/td>\n<\/tr>\n
vertical-align<\/td>\nverticalAlign<\/td>\n<\/tr>\n
visibility<\/td>\nvisibility<\/td>\n<\/tr>\n
width<\/td>\nwidth<\/td>\n<\/tr>\n
z-index<\/td>\nzIndex<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n
 <\/p>\n
Feito, agora voc\u00ea j\u00e1 sabe como mudar propriedades CSS com JQuery <\/strong>em tempo de execu\u00e7\u00e3o.<\/p>\n","protected":false},"excerpt":{"rendered":"
Veja como mudar propriedades CSS com JQuery de uma forma simples e f\u00e1cil, esta dica<\/p>\n","protected":false},"author":2,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"jetpack_post_was_ever_published":false,"_jetpack_newsletter_access":"","_jetpack_dont_email_post_to_subs":false,"_jetpack_newsletter_tier_id":0,"_jetpack_memberships_contains_paywalled_content":false,"_jetpack_memberships_contains_paid_content":false,"footnotes":"","jetpack_publicize_message":"","jetpack_publicize_feature_enabled":true,"jetpack_social_post_already_shared":false,"jetpack_social_options":{"image_generator_settings":{"template":"highway","default_image_id":0,"font":"","enabled":false},"version":2}},"categories":[40,41],"tags":[43,77,76],"class_list":["post-6655","post","type-post","status-publish","format-standard","hentry","category-javascript","category-jquery","tag-dicas","tag-javascript","tag-jquery"],"yoast_head":"\nComo mudar propriedades CSS com JQuery -<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.viamais.net\/blog\/como-mudar-propriedades-css-com-jquery\/\" \/>\n<meta property=\"og:locale\" content=\"pt_BR\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Como mudar propriedades CSS com JQuery -\" \/>\n<meta property=\"og:description\" content=\"Veja como mudar propriedades CSS com JQuery de uma forma simples e f\u00e1cil, esta dica\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.viamais.net\/blog\/como-mudar-propriedades-css-com-jquery\/\" \/>\n<meta property=\"og:site_name\" content=\"ViamaisBLOG\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/viamais.viablog\" \/>\n<meta property=\"article:author\" content=\"https:\/\/www.facebook.com\/viamais.viablog\" \/>\n<meta property=\"article:published_time\" content=\"2014-09-24T21:34:05+00:00\" \/>\n<meta property=\"og:image\" content=\"http:\/\/www.viamais.net\/blog\/wp-content\/uploads\/2012\/01\/ataque-ddos-pastehtmk-300x100.jpg\" \/>\n<meta name=\"author\" content=\"Petter Rafael\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@petterrafael\" \/>\n<meta name=\"twitter:site\" content=\"@petterrafael\" \/>\n<meta name=\"twitter:label1\" content=\"Escrito por\" \/>\n\t<meta name=\"twitter:data1\" content=\"Petter Rafael\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. tempo de leitura\" \/>\n\t<meta name=\"twitter:data2\" content=\"2 minutos\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/www.viamais.net\\\/blog\\\/como-mudar-propriedades-css-com-jquery\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.viamais.net\\\/blog\\\/como-mudar-propriedades-css-com-jquery\\\/\"},\"author\":{\"name\":\"Petter Rafael\",\"@id\":\"https:\\\/\\\/www.viamais.net\\\/blog\\\/#\\\/schema\\\/person\\\/a13697c83eb9e9fe998636b42c020ec2\"},\"headline\":\"Como mudar propriedades CSS com JQuery\",\"datePublished\":\"2014-09-24T21:34:05+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/www.viamais.net\\\/blog\\\/como-mudar-propriedades-css-com-jquery\\\/\"},\"wordCount\":377,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\\\/\\\/www.viamais.net\\\/blog\\\/#organization\"},\"image\":{\"@id\":\"https:\\\/\\\/www.viamais.net\\\/blog\\\/como-mudar-propriedades-css-com-jquery\\\/#primaryimage\"},\"thumbnailUrl\":\"http:\\\/\\\/www.viamais.net\\\/blog\\\/wp-content\\\/uploads\\\/2012\\\/01\\\/ataque-ddos-pastehtmk-300x100.jpg\",\"keywords\":[\"Dicas\",\"JavaScript\",\"JQuery\"],\"articleSection\":[\"JavaScript\",\"JQuery\"],\"inLanguage\":\"pt-BR\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\\\/\\\/www.viamais.net\\\/blog\\\/como-mudar-propriedades-css-com-jquery\\\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/www.viamais.net\\\/blog\\\/como-mudar-propriedades-css-com-jquery\\\/\",\"url\":\"https:\\\/\\\/www.viamais.net\\\/blog\\\/como-mudar-propriedades-css-com-jquery\\\/\",\"name\":\"Como mudar propriedades CSS com JQuery -\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.viamais.net\\\/blog\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/www.viamais.net\\\/blog\\\/como-mudar-propriedades-css-com-jquery\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/www.viamais.net\\\/blog\\\/como-mudar-propriedades-css-com-jquery\\\/#primaryimage\"},\"thumbnailUrl\":\"http:\\\/\\\/www.viamais.net\\\/blog\\\/wp-content\\\/uploads\\\/2012\\\/01\\\/ataque-ddos-pastehtmk-300x100.jpg\",\"datePublished\":\"2014-09-24T21:34:05+00:00\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/www.viamais.net\\\/blog\\\/como-mudar-propriedades-css-com-jquery\\\/#breadcrumb\"},\"inLanguage\":\"pt-BR\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/www.viamais.net\\\/blog\\\/como-mudar-propriedades-css-com-jquery\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"pt-BR\",\"@id\":\"https:\\\/\\\/www.viamais.net\\\/blog\\\/como-mudar-propriedades-css-com-jquery\\\/#primaryimage\",\"url\":\"https:\\\/\\\/i0.wp.com\\\/www.viamais.net\\\/blog\\\/wp-content\\\/uploads\\\/2012\\\/01\\\/ataque-ddos-pastehtmk.jpg?fit=498%2C166&ssl=1\",\"contentUrl\":\"https:\\\/\\\/i0.wp.com\\\/www.viamais.net\\\/blog\\\/wp-content\\\/uploads\\\/2012\\\/01\\\/ataque-ddos-pastehtmk.jpg?fit=498%2C166&ssl=1\",\"width\":\"498\",\"height\":\"166\",\"caption\":\"Exemplo de c\u00f3digo JavaScript\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/www.viamais.net\\\/blog\\\/como-mudar-propriedades-css-com-jquery\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"In\u00edcio\",\"item\":\"https:\\\/\\\/www.viamais.net\\\/blog\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"JavaScript\",\"item\":\"https:\\\/\\\/www.viamais.net\\\/blog\\\/category\\\/javascript\\\/\"},{\"@type\":\"ListItem\",\"position\":3,\"name\":\"Como mudar propriedades CSS com JQuery\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/www.viamais.net\\\/blog\\\/#website\",\"url\":\"https:\\\/\\\/www.viamais.net\\\/blog\\\/\",\"name\":\"ViamaisBLOG\",\"description\":\"Blog de tecnologia com dicas para melhorar sua internet e as novidades de gadgets e aplicativos.\",\"publisher\":{\"@id\":\"https:\\\/\\\/www.viamais.net\\\/blog\\\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/www.viamais.net\\\/blog\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"pt-BR\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/www.viamais.net\\\/blog\\\/#organization\",\"name\":\"Viablog\",\"url\":\"https:\\\/\\\/www.viamais.net\\\/blog\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"pt-BR\",\"@id\":\"https:\\\/\\\/www.viamais.net\\\/blog\\\/#\\\/schema\\\/logo\\\/image\\\/\",\"url\":\"https:\\\/\\\/i0.wp.com\\\/www.viamais.net\\\/blog\\\/wp-content\\\/uploads\\\/2014\\\/10\\\/logo_viamais.png?fit=150%2C150&ssl=1\",\"contentUrl\":\"https:\\\/\\\/i0.wp.com\\\/www.viamais.net\\\/blog\\\/wp-content\\\/uploads\\\/2014\\\/10\\\/logo_viamais.png?fit=150%2C150&ssl=1\",\"width\":150,\"height\":150,\"caption\":\"Viablog\"},\"image\":{\"@id\":\"https:\\\/\\\/www.viamais.net\\\/blog\\\/#\\\/schema\\\/logo\\\/image\\\/\"},\"sameAs\":[\"https:\\\/\\\/www.facebook.com\\\/viamais.viablog\",\"https:\\\/\\\/x.com\\\/petterrafael\"]},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/www.viamais.net\\\/blog\\\/#\\\/schema\\\/person\\\/a13697c83eb9e9fe998636b42c020ec2\",\"name\":\"Petter Rafael\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"pt-BR\",\"@id\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/ec1d50795aefe5170d97a2816386714d30fce28bcb746631048cc673d70f8443?s=96&d=identicon&r=g\",\"url\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/ec1d50795aefe5170d97a2816386714d30fce28bcb746631048cc673d70f8443?s=96&d=identicon&r=g\",\"contentUrl\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/ec1d50795aefe5170d97a2816386714d30fce28bcb746631048cc673d70f8443?s=96&d=identicon&r=g\",\"caption\":\"Petter Rafael\"},\"description\":\"Desenvolvedor Web atua com as tecnologias Java e PHP apoiadas pelos bancos de dados Oracle e MySQL. Al\u00e9m dos ambientes de desenvolvimento acima possuiu amplo conhecimento em servidores Apache\\\/Tomcat, Photoshop, Arte & Foto, Flash e mais uma dezena de ferramentas e tecnologias emergentes. Atualmente colabora com o Viablog escrevendo sobre programa\u00e7\u00e3o e tecnologia.\",\"sameAs\":[\"http:\\\/\\\/www.viamais.net\\\/blog\",\"https:\\\/\\\/www.facebook.com\\\/viamais.viablog\"],\"url\":\"https:\\\/\\\/www.viamais.net\\\/blog\\\/author\\\/petterrafael\\\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Como mudar propriedades CSS com JQuery -","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.viamais.net\/blog\/como-mudar-propriedades-css-com-jquery\/","og_locale":"pt_BR","og_type":"article","og_title":"Como mudar propriedades CSS com JQuery -","og_description":"Veja como mudar propriedades CSS com JQuery de uma forma simples e f\u00e1cil, esta dica","og_url":"https:\/\/www.viamais.net\/blog\/como-mudar-propriedades-css-com-jquery\/","og_site_name":"ViamaisBLOG","article_publisher":"https:\/\/www.facebook.com\/viamais.viablog","article_author":"https:\/\/www.facebook.com\/viamais.viablog","article_published_time":"2014-09-24T21:34:05+00:00","og_image":[{"url":"http:\/\/www.viamais.net\/blog\/wp-content\/uploads\/2012\/01\/ataque-ddos-pastehtmk-300x100.jpg","type":"","width":"","height":""}],"author":"Petter Rafael","twitter_card":"summary_large_image","twitter_creator":"@petterrafael","twitter_site":"@petterrafael","twitter_misc":{"Escrito por":"Petter Rafael","Est. tempo de leitura":"2 minutos"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.viamais.net\/blog\/como-mudar-propriedades-css-com-jquery\/#article","isPartOf":{"@id":"https:\/\/www.viamais.net\/blog\/como-mudar-propriedades-css-com-jquery\/"},"author":{"name":"Petter Rafael","@id":"https:\/\/www.viamais.net\/blog\/#\/schema\/person\/a13697c83eb9e9fe998636b42c020ec2"},"headline":"Como mudar propriedades CSS com JQuery","datePublished":"2014-09-24T21:34:05+00:00","mainEntityOfPage":{"@id":"https:\/\/www.viamais.net\/blog\/como-mudar-propriedades-css-com-jquery\/"},"wordCount":377,"commentCount":0,"publisher":{"@id":"https:\/\/www.viamais.net\/blog\/#organization"},"image":{"@id":"https:\/\/www.viamais.net\/blog\/como-mudar-propriedades-css-com-jquery\/#primaryimage"},"thumbnailUrl":"http:\/\/www.viamais.net\/blog\/wp-content\/uploads\/2012\/01\/ataque-ddos-pastehtmk-300x100.jpg","keywords":["Dicas","JavaScript","JQuery"],"articleSection":["JavaScript","JQuery"],"inLanguage":"pt-BR","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/www.viamais.net\/blog\/como-mudar-propriedades-css-com-jquery\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/www.viamais.net\/blog\/como-mudar-propriedades-css-com-jquery\/","url":"https:\/\/www.viamais.net\/blog\/como-mudar-propriedades-css-com-jquery\/","name":"Como mudar propriedades CSS com JQuery -","isPartOf":{"@id":"https:\/\/www.viamais.net\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.viamais.net\/blog\/como-mudar-propriedades-css-com-jquery\/#primaryimage"},"image":{"@id":"https:\/\/www.viamais.net\/blog\/como-mudar-propriedades-css-com-jquery\/#primaryimage"},"thumbnailUrl":"http:\/\/www.viamais.net\/blog\/wp-content\/uploads\/2012\/01\/ataque-ddos-pastehtmk-300x100.jpg","datePublished":"2014-09-24T21:34:05+00:00","breadcrumb":{"@id":"https:\/\/www.viamais.net\/blog\/como-mudar-propriedades-css-com-jquery\/#breadcrumb"},"inLanguage":"pt-BR","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.viamais.net\/blog\/como-mudar-propriedades-css-com-jquery\/"]}]},{"@type":"ImageObject","inLanguage":"pt-BR","@id":"https:\/\/www.viamais.net\/blog\/como-mudar-propriedades-css-com-jquery\/#primaryimage","url":"https:\/\/i0.wp.com\/www.viamais.net\/blog\/wp-content\/uploads\/2012\/01\/ataque-ddos-pastehtmk.jpg?fit=498%2C166&ssl=1","contentUrl":"https:\/\/i0.wp.com\/www.viamais.net\/blog\/wp-content\/uploads\/2012\/01\/ataque-ddos-pastehtmk.jpg?fit=498%2C166&ssl=1","width":"498","height":"166","caption":"Exemplo de c\u00f3digo JavaScript"},{"@type":"BreadcrumbList","@id":"https:\/\/www.viamais.net\/blog\/como-mudar-propriedades-css-com-jquery\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"In\u00edcio","item":"https:\/\/www.viamais.net\/blog\/"},{"@type":"ListItem","position":2,"name":"JavaScript","item":"https:\/\/www.viamais.net\/blog\/category\/javascript\/"},{"@type":"ListItem","position":3,"name":"Como mudar propriedades CSS com JQuery"}]},{"@type":"WebSite","@id":"https:\/\/www.viamais.net\/blog\/#website","url":"https:\/\/www.viamais.net\/blog\/","name":"ViamaisBLOG","description":"Blog de tecnologia com dicas para melhorar sua internet e as novidades de gadgets e aplicativos.","publisher":{"@id":"https:\/\/www.viamais.net\/blog\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.viamais.net\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"pt-BR"},{"@type":"Organization","@id":"https:\/\/www.viamais.net\/blog\/#organization","name":"Viablog","url":"https:\/\/www.viamais.net\/blog\/","logo":{"@type":"ImageObject","inLanguage":"pt-BR","@id":"https:\/\/www.viamais.net\/blog\/#\/schema\/logo\/image\/","url":"https:\/\/i0.wp.com\/www.viamais.net\/blog\/wp-content\/uploads\/2014\/10\/logo_viamais.png?fit=150%2C150&ssl=1","contentUrl":"https:\/\/i0.wp.com\/www.viamais.net\/blog\/wp-content\/uploads\/2014\/10\/logo_viamais.png?fit=150%2C150&ssl=1","width":150,"height":150,"caption":"Viablog"},"image":{"@id":"https:\/\/www.viamais.net\/blog\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/viamais.viablog","https:\/\/x.com\/petterrafael"]},{"@type":"Person","@id":"https:\/\/www.viamais.net\/blog\/#\/schema\/person\/a13697c83eb9e9fe998636b42c020ec2","name":"Petter Rafael","image":{"@type":"ImageObject","inLanguage":"pt-BR","@id":"https:\/\/secure.gravatar.com\/avatar\/ec1d50795aefe5170d97a2816386714d30fce28bcb746631048cc673d70f8443?s=96&d=identicon&r=g","url":"https:\/\/secure.gravatar.com\/avatar\/ec1d50795aefe5170d97a2816386714d30fce28bcb746631048cc673d70f8443?s=96&d=identicon&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/ec1d50795aefe5170d97a2816386714d30fce28bcb746631048cc673d70f8443?s=96&d=identicon&r=g","caption":"Petter Rafael"},"description":"Desenvolvedor Web atua com as tecnologias Java e PHP apoiadas pelos bancos de dados Oracle e MySQL. Al\u00e9m dos ambientes de desenvolvimento acima possuiu amplo conhecimento em servidores Apache\/Tomcat, Photoshop, Arte & Foto, Flash e mais uma dezena de ferramentas e tecnologias emergentes. Atualmente colabora com o Viablog escrevendo sobre programa\u00e7\u00e3o e tecnologia.","sameAs":["http:\/\/www.viamais.net\/blog","https:\/\/www.facebook.com\/viamais.viablog"],"url":"https:\/\/www.viamais.net\/blog\/author\/petterrafael\/"}]}},"jetpack_publicize_connections":[],"jetpack_featured_media_url":"","jetpack_shortlink":"https:\/\/wp.me\/p5Ih4c-1Jl","jetpack-related-posts":[{"id":2121,"url":"https:\/\/www.viamais.net\/blog\/conhecendo-a-jquery\/","url_meta":{"origin":6655,"position":0},"title":"Conhecendo a JQuery","author":"Petter Rafael","date":"09\/06\/2010","format":false,"excerpt":"[ad#texto] Eu n\u00e3o sou muito f\u00e3 de frameworks, at\u00e9 porque um framework pode engessar de forma desnecess\u00e1ria a sua aplica\u00e7\u00e3o e voc\u00ea fica dependente da ferramenta para prestar manuten\u00e7\u00e3o e\/ou atualizar sua aplica\u00e7\u00e3o, por\u00e9m em alguns casos temos que tirar o chap\u00e9u para um framework. \u00c9 o caso do JQuery,\u2026","rel":"","context":"Em "JavaScript"","block_context":{"text":"JavaScript","link":"https:\/\/www.viamais.net\/blog\/category\/javascript\/"},"img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]},{"id":4297,"url":"https:\/\/www.viamais.net\/blog\/descobrindo-o-tamanho-da-tela-com-jquery\/","url_meta":{"origin":6655,"position":1},"title":"Descobrindo o tamanho da tela com JQuery","author":"Petter Rafael","date":"22\/11\/2012","format":false,"excerpt":"[ad#texto] Ultimamente tenho me divertido um bocado programando interfaces Web e para isso o conjunto HTML + CSS + JQuery (JavaScript) tem demonstrado o n\u00edvel de refinamento que as interfaces Web possuem hoje, seja na caga ass\u00edncrona de dados ou puramente adicionando artefatos e efeitos visuais em tela, arrisco dizer\u2026","rel":"","context":"Em "Tecnologia"","block_context":{"text":"Tecnologia","link":"https:\/\/www.viamais.net\/blog\/category\/tecnologia\/"},"img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]},{"id":2131,"url":"https:\/\/www.viamais.net\/blog\/utilizando-mascaras-com-jquery\/","url_meta":{"origin":6655,"position":2},"title":"Utilizando m\u00e1scaras com JQuery","author":"Petter Rafael","date":"10\/06\/2010","format":false,"excerpt":"[ad#texto] Continuando a falar das facilidades de desenvolvimento trazidas com a JQuery, vou explicar como fazer de forma simplificada como fazer m\u00e1scaras utilizando a JQuery.\u00a0Observem\u00a0o c\u00f3digo abaixo: jQuery.noConflict(); jQuery(function($){ $(\"#cnpj\").mask(\"99.999.999\/9999-99\"); $(\"#cep\").mask(\"99.999-999\"); }); Perceberam a facilidade? Funciona da seguinte forma: A primeira linha tem a fun\u00e7\u00e3o de evitar conflitos com outros\u2026","rel":"","context":"Em "JavaScript"","block_context":{"text":"JavaScript","link":"https:\/\/www.viamais.net\/blog\/category\/javascript\/"},"img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]},{"id":3927,"url":"https:\/\/www.viamais.net\/blog\/utilizando-jquery-para-eventos-do-mouse\/","url_meta":{"origin":6655,"position":3},"title":"Utilizando JQuery para eventos do mouse","author":"Petter Rafael","date":"09\/08\/2012","format":false,"excerpt":"[ad#texto] Algumas vezes temos de inserir fun\u00e7\u00f5es JavaScript nos tr\u00eas eventos de mouse (onMouseOver, onMouseOut e onMouseMove) no mesmo elemento HTML. Nem \u00e9 precisa falar que s\u00e3o constantes os problemas de conflitos e quase sempre sofremos para equacionar nossas fun\u00e7\u00f5es JavaScript para trabalharem atuando no mesmo elemento, em tr\u00eas eventos\u2026","rel":"","context":"Em "Dicas"","block_context":{"text":"Dicas","link":"https:\/\/www.viamais.net\/blog\/category\/dicas\/"},"img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]},{"id":6633,"url":"https:\/\/www.viamais.net\/blog\/como-fazer-ancora-dinamica-com-jquery\/","url_meta":{"origin":6655,"position":4},"title":"Como fazer ancora din\u00e2mica com JQuery","author":"Petter Rafael","date":"17\/09\/2014","format":false,"excerpt":"Um bom efeito de transi\u00e7\u00e3o pode diferenciar seu site, veja como fazer ancora din\u00e2mica com JQuery e atribua este diferencial ao seu site. [ad#texto] Voc\u00ea j\u00e1 viu aquele efeito bonitinho onde ao clicar com um link a p\u00e1gina rola suavemente para a sua posi\u00e7\u00e3o? Ent\u00e3o, isso \u00e9 um tipo de\u2026","rel":"","context":"Em "Dicas"","block_context":{"text":"Dicas","link":"https:\/\/www.viamais.net\/blog\/category\/dicas\/"},"img":{"alt_text":"Como fazer ancora din\u00e2mica com JQuery","src":"https:\/\/i0.wp.com\/www.viamais.net\/blog\/wp-content\/uploads\/2014\/09\/jquery-mark-dark-300x194.gif?resize=350%2C200","width":350,"height":200},"classes":[]},{"id":6606,"url":"https:\/\/www.viamais.net\/blog\/mascaras-diversas-com-jquery-para-seu-formulario\/","url_meta":{"origin":6655,"position":5},"title":"Mascaras diversas com Jquery para seu formul\u00e1rio","author":"Petter Rafael","date":"11\/09\/2014","format":false,"excerpt":"Veja v\u00e1rias dicas de como validar seu formul\u00e1rio Web com mascaras diversas com JQuery e veja como usar toda o potencial do plugin JQuery-Mask. [ad#texto] Dias atr\u00e1s estive pesquisando sobre formas de utilizar mascaras diversas com Jquery, foi ent\u00e3o que notei que nem 10% do potencial do JQuery com o\u2026","rel":"","context":"Em "Dicas"","block_context":{"text":"Dicas","link":"https:\/\/www.viamais.net\/blog\/category\/dicas\/"},"img":{"alt_text":"Mascaras diversas com Jquery para seu formul\u00e1rio","src":"https:\/\/i0.wp.com\/www.viamais.net\/blog\/wp-content\/uploads\/2014\/09\/jquery-mark-dark-300x194.gif?resize=350%2C200","width":350,"height":200},"classes":[]}],"jetpack_sharing_enabled":true,"jetpack_likes_enabled":false,"_links":{"self":[{"href":"https:\/\/www.viamais.net\/blog\/wp-json\/wp\/v2\/posts\/6655","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.viamais.net\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.viamais.net\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.viamais.net\/blog\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/www.viamais.net\/blog\/wp-json\/wp\/v2\/comments?post=6655"}],"version-history":[{"count":0,"href":"https:\/\/www.viamais.net\/blog\/wp-json\/wp\/v2\/posts\/6655\/revisions"}],"wp:attachment":[{"href":"https:\/\/www.viamais.net\/blog\/wp-json\/wp\/v2\/media?parent=6655"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.viamais.net\/blog\/wp-json\/wp\/v2\/categories?post=6655"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.viamais.net\/blog\/wp-json\/wp\/v2\/tags?post=6655"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}