I am looking at using a background image to use on the window.
I currently would like to put an image as a background and make it about A4 size so if someone wishes to print it, then it could be possible. However even if I reference an image off the internet it still does not show, however the colour does.
I have tried to simply use your kendo window mvc demo code but no luck. I have added a Div referenced test to simply add an image
Do you have any ideas?
Thanks
@(Html.Kendo().Window()
.Name("window")
.Title("About Alvar Aalto")
.Content(@<text>
<div class="test">
<p>
Alvar Aalto is one of the greatest names in modern architecture and design.
Glassblowers at the iittala factory still meticulously handcraft the legendary
vases that are variations on one theme, fluid organic shapes that let the end user
ecide the use. Interpretations of the shape in new colors and materials add to the
growing Alvar Aalto Collection that remains true to his original design.
</p>
<p>
Born Hugo Alvar Henrik Aalto (February 3, 1898 - May 11, 1976) in Kuortane, Finland,
was noted for his humanistic approach to modernism. He studied architecture at the
Helsinki University of Technology from 1916 to 1921. In 1924 he married architect
Aino Marsio.
</p>
<p>
Alvar Aalto was one of the first and most influential architects of the Scandinavian
modern movement, and a member of the Congres Internationaux d'Architecture Moderne.
Major architectural works include the Finlandia Hall in Helsinki, Finland,
and the campus of Helsinki University of Technology.
</p>
<p>
Source:
<a href="http://www.aalto.com/about-alvar-aalto.html" title="About Alvar Aalto">www.aalto.com</a>
</p>
</div>
</text>)
.Draggable()
.Resizable()
.Width(600)
.Actions(actions => actions.Pin().Minimize().Maximize().Close())
.Events(ev => ev.Close("onClose"))
)
<span id="undo" style="display:none" class="k-button">Click here to open the window.</span>
<script>
function onClose() {
$("#undo").show();
}
$(document).ready(function() {
$("#undo").bind("click", function() {
$("#window").data("kendoWindow").open();
$("#undo").hide();
});
});
</script>
<style scoped>
#example
{
min-height:500px;
}
#undo {
text-align: center;
position: absolute;
white-space: nowrap;
padding: 1em;
cursor: pointer;
}
.test
{
background-image:url("http://blog.felho.hu/wp-content/debuggingsuckststingrocks.png");
background-color:#cccccc;
width:200px;
height:200px;
}
</style>
I currently would like to put an image as a background and make it about A4 size so if someone wishes to print it, then it could be possible. However even if I reference an image off the internet it still does not show, however the colour does.
I have tried to simply use your kendo window mvc demo code but no luck. I have added a Div referenced test to simply add an image
Do you have any ideas?
Thanks
@(Html.Kendo().Window()
.Name("window")
.Title("About Alvar Aalto")
.Content(@<text>
<div class="test">
<p>
Alvar Aalto is one of the greatest names in modern architecture and design.
Glassblowers at the iittala factory still meticulously handcraft the legendary
vases that are variations on one theme, fluid organic shapes that let the end user
ecide the use. Interpretations of the shape in new colors and materials add to the
growing Alvar Aalto Collection that remains true to his original design.
</p>
<p>
Born Hugo Alvar Henrik Aalto (February 3, 1898 - May 11, 1976) in Kuortane, Finland,
was noted for his humanistic approach to modernism. He studied architecture at the
Helsinki University of Technology from 1916 to 1921. In 1924 he married architect
Aino Marsio.
</p>
<p>
Alvar Aalto was one of the first and most influential architects of the Scandinavian
modern movement, and a member of the Congres Internationaux d'Architecture Moderne.
Major architectural works include the Finlandia Hall in Helsinki, Finland,
and the campus of Helsinki University of Technology.
</p>
<p>
Source:
<a href="http://www.aalto.com/about-alvar-aalto.html" title="About Alvar Aalto">www.aalto.com</a>
</p>
</div>
</text>)
.Draggable()
.Resizable()
.Width(600)
.Actions(actions => actions.Pin().Minimize().Maximize().Close())
.Events(ev => ev.Close("onClose"))
)
<span id="undo" style="display:none" class="k-button">Click here to open the window.</span>
<script>
function onClose() {
$("#undo").show();
}
$(document).ready(function() {
$("#undo").bind("click", function() {
$("#window").data("kendoWindow").open();
$("#undo").hide();
});
});
</script>
<style scoped>
#example
{
min-height:500px;
}
#undo {
text-align: center;
position: absolute;
white-space: nowrap;
padding: 1em;
cursor: pointer;
}
.test
{
background-image:url("http://blog.felho.hu/wp-content/debuggingsuckststingrocks.png");
background-color:#cccccc;
width:200px;
height:200px;
}
</style>