So i created a web site a long time ago using a designer alot like frontpage + expression design put together, and since then Ive gotten more into coding, and I'm learning html, CSS, and all that good stuff.. and i have this re-designed header that Ive made here:
http://prntscr.com/8zct
So what I need to know, is how i can get it so that when a user clicks on one of the links in the header design it will redirect to a page. and also if possible, how to make it so when a user hovers over a link a drop down may appear with other options, EDIT: I'd like to be able to add a backround image to the drop down navigation menu
As me being quite new to this sort of stuff, could anybody help me achieve this?
PS. I'm working in Visual Studio with ASP. but that doesn't change anything about the html and css stuff. just letting you guys know.
To navigate based on clicks on certain areas of an image, read about image maps.
To create menus and other active components, read about JavaScript (also recommended: jQuery).
You can also create divs that are clickable to use as hot spots on an image. that way you could add a background image to that div if ti's hovered/clicked, whereas image maps does not afford you that opportunity.
Related
I am coding a Windows Forms Application in C#, and one of the requirements is to display some html code in a control, with the correct colors that correspond to the relevant tags.
E.g. When right clicking on a webpage in Google Chrome, then selecting View Page Source, a form is shown with all the html, correctly formatted, with tag colors and each line of code's line number.
Is there a free, reliable control that can do this? Is there an inbuilt Microsoft control that does this?
As I am new to this area of coding, can someone please provide me with some useful names, and some resource links if possible? I am not sure of the correct name for a control that does this, and as such, my Google searches have not come up with what I am looking for.
Also, the control needs to be trustworthy.
Thanks
You can try ScintillaNET control. It's open source and has HTML syntax highlighting as well as many other features.
I have a page which contains user controls with Telerik Charts (grids also, but they work fine). From this page, the user can click on a button to be redirected to a "Printer-Friendly Version" type page, which opens a new window via javascript and goes through a slightly different view (for formatting and stuff), but the telerik code is all the same.
The problem is, my Chart displays just fine in the original window, but the new window displays basically an empty chart with no data. This bug is only present in IE, and only applies to Charts. Grids work fine, for whatever reason. I'm thinking this is due to differences in script caching between browsers -- correct me if I'm wrong, I'm semi-new to client-directed web development.
Anyway I read somewhere that Telerik has issues with loading data and/or js files when loaded via ajax, so maybe that's the problem? If so, how could I get around this? And if not, any ideas on what could be causing this issue? It's causing me a great deal of frustration, since a print preview page seems like it should be the easiest of jobs.
Edit:
The charts are being rendered as html (if somebody can explain how to render them as images, that would be awesome). And dev tools shows basically the same thing between chrome and IE. Whenever my web service goes back up ill WinMerge them and look for any peculiarities/differences between them. In the mean time, though, the "render as an image" concept sounds promising. That way I could just save the image from the first page, and insert it right into the print preview page, right?. And since it's a print-preview page, it's not going to need to be interactive or anything, so that'd work out nicely.
Another (important) Edit:
These are probably the culprit...
And here is a little more detail on that:
And here is a side-by-side of it working(in chrome) and not working (in IE):
Have you considered using a print-specific stylesheet instead, e.g.
<link rel="stylesheet" type="text/css" media="print" href="print.css" />
In which you specify the styling to apply when printing.
That way, you avoid reloading the page (duplicate database hits, etc.) and don't need to delve into the AJAX of Telerik's controls.
EDIT:
Regarding using an image rather than HTML, first make sure you won't lose any features/detail, then check out the .Save() method of the RadChart control. You could either save it to a memory stream, or if you want to re-use the image save it to a directory on the webserver and clean it up periodically. That way, you can just point your print version to the image and not re-generate it.
This Telerik forum post may be of use.
I am working on an ASP.NET/C# application,
I am looking for the best way to do the following. (Note: I don't need you to tell me how to do it, just if you can point me to the right direction to look)
in my main page I have a button. When the user clicks it,I want to open popup open containing a map. the user can click on counties to highlight them and then click on submit. I want to be able to know which countries the user has clicked on in my main page (maybe save it in a array or string or anything)
What is the best way to do this? Should I use flash?
I know this is not a problem/solution type of question, but if someone can point me in the right direction I would very much appreciate it. Just some ideas and I will do the researches.
Thank you very much for any inputs or comments
And sorry for not being a specific problem question.
For the pop-up you can use a dialog (a "modal" HTML form like what you find in jQuery UI or similar). If you're using plain "old" ASP.NET you may need some trick if you want to use forms but they works well.
If what you want to provide is a selection from a map you do not need Flash (at least I wouldn't use it for such simple task, I'm not a fun of that kind of extensions). An image map can work well and it's more portable. If you want you may use HTML5 features to provide better experience for users with a compatible browser. I do not remember the link but I saw a very nice example of this using plain HTML (4) and JavaScript. Using a low-res image as base for the map, small images as checks applied on top of it and div tooltips for details (it supported a zoom-on-click feature too to enlarge a portion of the map loading a higher resolution version). I guess I wrote somewhere that URL...
Links
Nice article: http://www.workwithchoicecuts.com/methodology/revisiting-the-html-image-map/
For image maps basics: http://www.javascriptkit.com/howto/imagemap.shtml
Image map builder: http://www.image-maps.com/
jQuery plug-in for selection from maps: https://github.com/jquery/plugins.jquery.com
I am attempting to create a 'find on page' search option for a wp7 webbrowser control named 'TheBrowser' (using the standard webbrowser control in Visual Studio). I have done a lot of research but have not found much in the way of an example or sample where this was implemented. Essentially I will just be activating the search on a click event, from a textbox where the user may type in a word to search in the current webpage. I would also like to highlight the matched words as seen when doing a find on page search on a desktop browser.
I believe that to create this 'find on page' option I should use javascript to search through the lines of text, and then somehow highlight matched words. I have already implemented forward, back, and refresh buttons using TheBrowser.InvokeScript, but I do not know how to format for searching through the entire webpage (I have never done anything like this before). Any advice or assistance would be greatly appreciated, including code samples as I am completely new to this subject! Thanks in advance for your help and hard work!
Try jquery, this should do the trick: http://hugoware.net/blog/more-jquery-magic-search-highlighting You'll just need to inject the jquery script into the page.
I'm developing a Silverlight application for the first time. I've gone through some tutorials, but I can't seem to find anything that helps me with this particular problem. I would like a set of buttons to be present on all of my pages (like a template). When a button is pressed, I would like the ContentGrid to slide out and a new ContentGrid slide in (with the relevant .xaml file being loaded).
Are there any tutorials showing the best way to do this? From samples I've seen, they only seem to transition between two pages, so copy-pasting the group of buttons on each xaml page isn't too much of a problem. However, with more pages, it would be inefficient to copy-paste the base layout each time.
Thanks for any suggestions
I used to create a master view and create each page content as a user control; that way, I can swap out/in the user control for the appropriate page, and I would have a consistent header that way... similar to a master page in ASP.NET. I'm sure there are other templates too; I'm not aware of everything available for Silverlight...
The one answer I cannot provide is the transition; the only thing I can offer is Telerik has a control for that purpose, the transition control: http://demos.telerik.com/silverlight/#Controls I understand if you can't drop a couple of hundred bucks to get it though :-)
HTH.
Have you tried the Silverlight Business Application Visual Studio Project template?