How does the DiggBar work?

2019-02-02 02:01发布

站内文章 / HTML/CSS
28 0 0

问题:

How does the DiggBar work?

I'm trying to make an ASP.NET MVC DiggBar clone just for learning purposes and does anyone have a suggestion on how to specify the url of the content for the lower frame? How would you go about constructing that in MVC?

Also, I know that it is an iFrame, but how do they position it so regardless of scrolling it stays positioned at the top? Is it CSS magic?

Edit: I'm not interested in whether or not you like them. I am not putting one into production and I'm not asking for whether they are good design or not. I simply ~want~ to make one.

I find the DiggBar useful and I like it. Hell, you can turn it off in two clicks! Similarly, reddit has a reddit bar which is opt-in (probably better approach).

回答1:

The basic html is:

<html>
<head>
  <style type="text/css">
    #toolbar {position: fixed; top: 0; height: 40px; width: 100%; ... }
    #page {width: 100%; height: 100%;}
  </style>
</head>
<div id="toolbar">
  All your toolbar stuff here.
</div>
<iframe id="page" name="page" src="http://url.to/page" frameborder="0" noresize="noresize"></iframe>
</html>

You would have a slug on your own URLs that maps to the page's URL, e.g.
d1oKo3 => http://news.bbc.co.uk/2/hi/technology/7991708.stm

All your view would have to do is look up the mapping and put the page's URL into the iframe's src. Just make sure you have a way for users to opt out, as some people don't like this sort of toolbar.



回答2:

It may well be a horrible blight on the interweb in your opinion but that wasn't what the man asked - why do you think anyone cares whether you think these tool bars should exist out there or not? no ones asking you to use em.

If you feel that they shouldn't then simply butt out and let someone else answer the question. After all if they really are so unpopular folk will vote with thier mice and go elsewhere and the sites that deploy them will dwindle to nothing. Thats whats so great about the web, it doesn't need impotent geeks dictating whats good and whats not folk can decide for themselves.

Happy coding your way.



回答3:

First of all, please don't do something like that, I don't know anyone that likes those things.

Something can be kept at the top like that using the CSS:

position: fixed;

As for specifying the URL, I'm not sure exactly what you're asking. When you click on a link on digg now, the destination URL is something like this:

http://digg.com/d1oIyx

The "d1oIyx" would just be used as a primary key into a database where they're storing the URL to be loaded in the bottom iframe.



回答4:

thanks , i found a solution that work ( attached ) , but how i make it full page iframe ?

working link : http://www.clalit.org/2.php?link=http://cnn.com

<?php
$link=$_GET["link"];
echo "<iframe src=\"$link\"/>";
?>


标签： asp.net-mvc css digg
举报

收藏的人(0)

Ta的文章 更多文章
登录 后发表评论
0条评论
还没有人评论过~