by
363 8
0
3
1,351
0
Top 1% !
Famous
Specified
Popularity: 22470th place
No tags for this snippet yet.
LanguageColdFusion
SourceGitHub

Responsive Text CSS with Coldfusion

Responsive Text CSS with Coldfusion: 
rt.cfm
Copy Embed Code
<iframe id="embedFrame" style="width:600px; height:300px;"
src="https://www.snip2code.com/Embed/1018424/Responsive-Text-CSS-with-Coldfusion?startLine=0"></iframe>
Click on the embed code to copy it into your clipboard Width Height
Leave empty to retrieve all the content Start End
<cfscript> // serve content as mime type css getPageContext().getResponse().setcontenttype('text/css;charset=utf-8'); // supress whitespace with cfoutputonly setting enablecfoutputonly="true"; // example of url varialbe call: /rt.cfm?height=1.25&weight=bold // structure of default values, if not received in url variables.baseSize = { lineHeight = (structkeyexists(url,'size')) ? url.height : 1.5, fontWeight = (structkeyexists(url,'size')) ? url.weight : 'normal' }; private string function rt(required numeric variableMultiplier,required numeric maxMultiplier){ var reponsiveText = ''; savecontent variable = 'reponsiveText' { writeoutput("font-size: #numberformat(arguments.variableMultiplier/arguments.maxMultiplier,'9.99')#rem;"); writeoutput(chr(10)&chr(9)); writeoutput("line-height: #numberformat((variables.baseSize.lineHeight*arguments.variableMultiplier)/arguments.maxMultiplier,'9.99')#rem;"); } return reponsiveText; } </cfscript> <cfoutput> .rt { font-weight: #variables.baseSize.fontWeight#; } @media only screen and (min-width: 360px) { .rt { #rt(1.2,1.68)# } } @media only screen and (min-width: 390px) { .rt { #rt(1.224,1.68)# } } @media only screen and (min-width: 420px) { .rt { #rt(1.248,1.68)# } } @media only screen and (min-width: 450px) { .rt { #rt(1.272,1.68)# } } @media only screen and (min-width: 480px) { .rt { #rt(1.296,1.68)# } } @media only screen and (min-width: 510px) { .rt { #rt(1.32,1.68)# } } @media only screen and (min-width: 540px) { .rt { #rt(1.344,1.68)# } } @media only screen and (min-width: 570px) { .rt { #rt(1.368,1.68)# } } @media only screen and (min-width: 600px) { .rt { #rt(1.392,1.68)# } } @media only screen and (min-width: 630px) { .rt { #rt(1.416,1.68)# } } @media only screen and (min-width: 660px) { .rt { #rt(1.44,1.68)# } } @media only screen and (min-width: 690px) { .rt { #rt(1.464,1.68)# } } @media only screen and (min-width: 720px) { .rt { #rt(1.488,1.68)# } } @media only screen and (min-width: 750px) { .rt { #rt(1.512,1.68)# } } @media only screen and (min-width: 780px) { .rt { #rt(1.536,1.68)# } } @media only screen and (min-width: 810px) { .rt { #rt(1.56,1.68)# } } @media only screen and (min-width: 840px) { .rt { #rt(1.584,1.68)# } } @media only screen and (min-width: 870px) { .rt { #rt(1.608,1.68)# } } @media only screen and (min-width: 900px) { .rt { #rt(1.632,1.68)# } } @media only screen and (min-width: 930px) { .rt { #rt(1.656,1.68)# } } @media only screen and (min-width: 960px) { .rt { #rt(1.68,1.68)# } } @media only screen and (max-width: 360px) { .rt { #rt(1.2,1.68)# } } </cfoutput>
If you want to be updated about similar snippets, Sign in and follow our Channels

blog comments powered by Disqus