does anyone know a sidebar (or 'panel' like it's called in opera) that I can use for number conversions (decimal to hex and so on)? Currently I'm using this one but it's a bit too large to fit a narrow sidebar.
Since it's just a bit of JavaScript, one can roll it oneself:
<html>
<body>
<form>
<input name="dec" id="dec"
placeholder="decimal"
onBlur="document.getElementById('hex').value=
parseInt(this.value,10).toString(16)"
></input>
<br />
<input name="hex" id="hex"
placeholder="hex"
onBlur="document.getElementById('dec').value=
parseInt(this.value,16).toString(10)"
></input>
</form>
</body>
</html>
Related
As far as I know, BEM does not use elements id at all. But how to deal in this case with the label for/id combined with inputs? If I do not use id, people who're using screen readers will not get that this label is for that input. Am I right?
BEM suggests avoiding id for css selectors. It's perfectly valid to use id for A11y and usability.
<form class="form" method="post" action="">
<label for="email" class="form__label">Email</label>
<input type="email" id="email" class="form__control"/>
</form>
In the example above we are styling the input as an Element of the form block with the form__control class.
Also you can not use aria attributes without id for pointers to descriptive elements.
<div role="application" aria-labelledby="calendar" aria-describedby="info">
<h1 id="calendar">Calendar</h1>
<p id="info">
This calendar shows the game schedule for the Boston Red Sox.
</p>
<div role="grid">
...
</div>
</div>
Example taken from: https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_aria-describedby_attribute
I want to show HTML5 videos with subtitles.
If i have a html file (for Chrome, with Playr), with this for example
...
<video class="playr_video" preload="metadata" width="1000" height="700" poster="poster1.jpg" style="border:1px solid gray;padding: 0% 0;" controls>
<source src="trailer.webm" type="video/webm" />
<track src="trailer-en.vtt" label="English subtitles" kind="subtitles" srclang="en">
<track src="trailer-el.vtt" label="Greek subtitles" kind="subtitles" srclang="el">
Your browser does not support the video tag, please update mime type.
</video>
...
it works.
But i have many videos to show, so i want one PHP file to control consistently as video showing page.
So in Joomla articles i do this (example, to illustrate)
<form action="video.php" method="post" target="_blank">
<input style="display: none;" id="video" name="video" value="trailer.webm" type="text" />
<input style="display: none;" id="poster" name="poster" value="video1poster.jpg" type="text" />
<input style="display: none;" id="subsen" name="subsen" value="video1subsen.jpg" type="text" />
<input style="display: none;" id="subsel" name="subsel" value="video1subsel.jpg" type="text" />
<input src="showvideo.jpg" type="image" />
</form>
and a php file just receives POST variables (like $video, $suben, $subel) and gives the same html like the code written in the beginning.
So in the page's source in Chrome, everything comes as intended, all code is correct, all files are properly refered. But subtitles do not show up.
Please note that in the Playr packet, there is a json file which i do not use because i cound not find instructions, i just use the two files playr.css and playr.js, but i don't think this hurts, i really have no idea why. Any help appreciated, thanks.
Solved: ALL files MUST reside in the same domain.-
i have this website im building, my client is using a template and the template has contact forms, now i cant seem to understand how to get the text fade on click for input fields to work on any additional fields i make on top of what was there on the template.
http://daniloportal.com/NPC2/contact.html
on that page take a look at the form, the values with *'s disappear but the clone EMAIL input i made doesnt cause i took the * off the value.
Ive been going crazy trying to figure out where this is being configured on the page, If any inspect elementors can take a look and let me know i would greatly appreciate it!
this is the code snip
<form id="ajax-contact-form" action="">
<input type="text" name="name" value="Name *" title="Name *" />
<input type="text" name="email" value="Email *" title="Email *" />
<input type="text" name="email" value="Email " title="Email *" />
<textarea name="message" id="message" title="Message *">Message *</textarea>
<div class="clear"></div>
<input type="reset" class="btn btn_clear" value="Clear form" />
<input type="submit" class="btn btn_blue btn_send" value="Send message!" />
<div class="clear"></div>
</form>
Search your code to find what makes the input's value disappear. E.g., look for behavior that clears the value of form fields (either element.value = '' if using plain javascript, or element.val('') if using jquery).
Then you can see what is the condition to clearing it. In your case, seems that the condition is that the input's value is equal to it's "title" attribute (you can edit both using "Inspect Element" in Chrome).
I have the following code, and hate having to indent code to the same line when I just want it to stay as it is?
What I have to indent it to:
.content.first
Thank you for taking our Survey, hope you had fun!!!
<!-- Begin MailChimp Signup Form -->
<link href="http://cdn-images.mailchimp.com/embedcode/slim-081711.css" rel="stylesheet" type="text/css">
<div id="mc_embed_signup" style="text-align:center">
<form onsubmit="_kmq.push(['record', 'sign up for our newsletter'])" action="http://socialcrunch.us5.list-manage.com/subscribe/post?u=755f44e55d468b9568a7ec9de&id=7f27e118c4" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank">
%label{:style=>"text-align:center"}
%br
Like spandex wearing gym freaks, SocialCrunch is in training.
%br
%br
You have been one of the first people to take part in a test which will form the basis of our website.
%br
%br
Input your email below to learn more about SocialCrunch and our launch later this summer!
%br
%br
Thank you for taking part, we hope you had fun.
<input style="margin-left: 21%;text-align:center" type="email" value="" name="EMAIL" class="email" id="mce-EMAIL" placeholder="email address" required>
<div class="clear"><input style="margin-left:33%" type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button"></div>
</form>
</div>
Can I run it through some filter that will ignore my indentation and wont complain?
HAML syntax is indentation sensitive and there is no 'filter' which will ignore your indentation. HAML uses indentation to convert your code properly to respective HTML code blocks.
If you are tired of manually indenting your haml code and are using emacs as your editor then you can follow the instructions here
http://emacswiki.org/emacs/HamlMode
and permanently solve your problem
I have some code below:
<div class="product-page-wrapper">
<div class="product-page-img">
<img alt="" width="137" height="125" src="/Portals/6/aggProd.png" />
</div>
<div class="product-page-title">**D-077**</div>
<div class="product-page-desc">
<br />
<br />
<br />
</div>
<div class="product-page-sep">
<img alt="" width="732" height="1" src="/Portals/6/spec-sep.png" />
</div>
</div>
<div class="product-page-spec-title">
Specifications
</div>
<div class="product-page-spec-desc">
<br />
Type -
<span style="color: #1296d3;">
**D-077**
</span>
<br />
<br />
Weight lbs. (kg) - <br />
<br />
Dimensions (mm) -<br />
<span style="color: #1296d3;">
L - **207** W - **175** H - **175**
</span>
</div>
<div class="product-page-spec-button">
<a target="_blank">
<img alt="" width="215" height="64" src="/Portals/6/spec-button.png" />
</a>
</div>
At the moment i am only changing the Product Page Title, Type, Dimemsion values. I have a massive spread sheet with these values and wanted to know if i could input these values into my code automatically.
This would save me alot of time.
what would be the best way?
I am using DNN 5.6.2
Even if i could reproduce the code i could then paste it into my CMS editor.
There are a lot of ways to do this, depending on the tools at your disposal.
One way is to create an ASP.NET page with a repeater in it, and use the OLE DB driver for Excel to use the spreadsheet as a datasource. You can see this question for more details as to how to do it. You could even build such a control into a DotNetNuke module if you want to, then you could have the content update to match the spreadsheet dynamically if the spreadsheet ever changes.
Another approach you could use if you really just want to copy-and-paste the values from the spreadsheet into the CMS, is to use Excel to generate the code. For example, if you're using columns A-E in Excel, you could put a formula like the following in column F:
=CONCATENATE("<div class=""product-page-wrapper""><div class=""product-page-img""><img alt="""" width=""137"" height=""125"" src=""/Portals/6/aggProd.png"" /></div><div class=""product-page-title"">",A2,"</div>", "...etc...")
(This is just an example. You'd have to flesh out the rest of the code, and you might have to use multiple columns to get past string length limitations in Excel)
Then you could paste that formula into every row, and then copy the resulting values from Excel into the CMS text field. This is really a bootleg way of doing things, and writing a DNN module is definitely more ideal, but using Excel functions to generate the code is an option if this is one of those "I need it in 5 minutes and then I'm never going to use it again" situations.