- Posts: 11526
- Thank you received: 3050
~~~~~~~~~~~~ IMPORTANT INFORMATION -- Please read! ~~~~~~~~~~~~
1. The "search..." box above searches the Docs & Forum Posts. The "Search" tab above just searches the Forum Posts. 
Please use these to search for your issue *before* creating a new message topic, as your issue may have been previously solved.
2. Please put your Club # and Club Web Address in your Forum Signature (best) OR in each post to get faster support from us.
Click here to edit your signature at the bottom of the Profile Information tab.
3. Our user and admin docs are available at:
support.toastmastersclubs.org/doc
"There's a doc for that!" 
4. There is an "Opt In" Feature for newly added members. The Opt In document explains the [strike]strikethrough[/strike] member information.
Click Here to View the Post
5. When posting a
New Topic
, please include all relevant details and be specific. When did your issue 1st occur?
What operating system, browser, & browser version are you using?
Did you refresh your browser cache? Are your cookies enabled? Lastly, a
screen shot
is often helpful.
6. Please abide by the
Terms of Use
. We are volunteers contributing our spare time. We are happy to assist you, so long as you are respectful and courteous.
7. We are always looking for new FreeToastHost Ambassadors to join our team and support fellow Toastmasters in their use of the FreeToastHost website system. If you are familiar with the system and have some interest, send a
Send Us a Private Message.
A technical HTML question...
- SteveTheTechie
- Topic Author
- Offline
- Administrator
-
12 years 10 months ago - 12 years 10 months ago #20270
by SteveTheTechie
Replied by SteveTheTechie on topic A technical HTML question...
Upon further investigation, it turns out that there is a small caveat with this approach.
Once you enter the link target for the button image, the image takes on a border that does not go away with .noprint.
The workaround that I came up with is to explicitly set the image border to be 1 pixel with a white color.
Then everything works as intended regardless of whether the link has been set or not.
As an example of what I am talking about, see the attachment which show the image settings I came up with for my button image.
Also, I have attached a screen shot of my resulting button. I will probably refine it a bit, but it works fine for now. Right now, I am just linking to the FTH2 FAQs, but I will probably come up with a Printing Tips document to link to.
BTW, for some reason using a link with a bookmark to the Agenda FAQs does not seem to land on the right spot on the FAQs page. I ended up ditching the bookmark part of the link.
Once you enter the link target for the button image, the image takes on a border that does not go away with .noprint.
The workaround that I came up with is to explicitly set the image border to be 1 pixel with a white color.
Then everything works as intended regardless of whether the link has been set or not.
As an example of what I am talking about, see the attachment which show the image settings I came up with for my button image.
Also, I have attached a screen shot of my resulting button. I will probably refine it a bit, but it works fine for now. Right now, I am just linking to the FTH2 FAQs, but I will probably come up with a Printing Tips document to link to.
BTW, for some reason using a link with a bookmark to the Agenda FAQs does not seem to land on the right spot on the FAQs page. I ended up ditching the bookmark part of the link.
Last edit: 12 years 10 months ago by SteveTheTechie.
- SteveTheTechie
- Topic Author
- Offline
- Administrator
-
12 years 9 months ago - 12 years 9 months ago #20456
by SteveTheTechie
Replied by SteveTheTechie on topic A technical HTML question...
Brad,
I have gone further with this, but the.noprint approach still is not quite working as expected....
Please take a look at the two attachements... "Agenda Buttons" is excerpted from a screen shot of my agenda screen with the "buttons" added to the agenda header. I have added the .noprint class specification to each button image--I also added it to the links that were applied to the button images. "Agenda Buttons Print" is what I get when I actually send the Agenda printout report tab to the printer (or print preview). Previously, I had not actually done a print preview--just looked at the printout tab.
The white border takes care of the link display issue as previously noted, but as you can see, for some reason, parts of the "buttons" still show on the actual printout even though they do not show on the agenda printout tab.
Any thoughts on how to correct this? I want the buttons on the agenda screen, but I don't want buttons on my printouts.
BTW, the Printing Tips button goes here and actually references one of your past message threads.
I have gone further with this, but the.noprint approach still is not quite working as expected....
Please take a look at the two attachements... "Agenda Buttons" is excerpted from a screen shot of my agenda screen with the "buttons" added to the agenda header. I have added the .noprint class specification to each button image--I also added it to the links that were applied to the button images. "Agenda Buttons Print" is what I get when I actually send the Agenda printout report tab to the printer (or print preview). Previously, I had not actually done a print preview--just looked at the printout tab.
The white border takes care of the link display issue as previously noted, but as you can see, for some reason, parts of the "buttons" still show on the actual printout even though they do not show on the agenda printout tab.
Any thoughts on how to correct this? I want the buttons on the agenda screen, but I don't want buttons on my printouts.
BTW, the Printing Tips button goes here and actually references one of your past message threads.
Last edit: 12 years 9 months ago by SteveTheTechie.
- SteveTheTechie
- Topic Author
- Offline
- Administrator
-
12 years 9 months ago - 12 years 9 months ago #20457
by SteveTheTechie
Replied by SteveTheTechie on topic A technical HTML question...
Ok, never mind. I have figured out my own issue. 
When you use the .noprint class for this type of approach, you have to create a <div> container around all of the page elements that you do not want to print and apply the .noprint class to the <div> container. If you apply the .noprint class to the individual images/page elements, you still get parts of them showing up on the end output.
I have not used <div> containers for much other then inserting background shading on pages... This is obviously a new use I will have to keep in mind.
When you use the .noprint class for this type of approach, you have to create a <div> container around all of the page elements that you do not want to print and apply the .noprint class to the <div> container. If you apply the .noprint class to the individual images/page elements, you still get parts of them showing up on the end output.
I have not used <div> containers for much other then inserting background shading on pages... This is obviously a new use I will have to keep in mind.
Last edit: 12 years 9 months ago by SteveTheTechie.
- Brad Smith
- Visitor
-
12 years 9 months ago - 12 years 9 months ago #20458
by Brad Smith
Replied by Brad Smith on topic A technical HTML question...
Using inline media CSS works outside FTH. See if this works inside using this code:
Here is a basic button.
This button has a bit of styling to it using red/gold TM colors.
Here is a basic button.
Code:
<div id="HideThisDiv">
<style type="text/css">
@media print {
#NoPrintDiv { visibility: hidden; }
}
</style>
<div id="NoPrintDiv">
<input type="button" value = "Printing Tips" onclick="window.open('https://docs.google.com/document/pub?id=1TiLps1y3ANNPMsMm7zFCLLTKw7A7I92gd3rmLdusFL4','_blank','resizable=yes')" />
</div>
</div>
This button has a bit of styling to it using red/gold TM colors.
Code:
<div id="HideThisDiv">
<style type="text/css">
@media print {
#NoPrintDiv { visibility: hidden; }
}
</style>
<div id="NoPrintDiv">
<input type="button" value="Printing Tips" style="background-color:#762432; color:#f3de73; font-weight:700; font-size:1em; height:45px; width:140px;" onclick="window.open('https://docs.google.com/document/pub?id=1TiLps1y3ANNPMsMm7zFCLLTKw7A7I92gd3rmLdusFL4','_blank','resizable=yes')" />
</div>
</div>
Last edit: 12 years 9 months ago by Brad Smith.
Time to create page: 0.104 seconds